Aphotic

http://www.seoconsultants.com/css/menus/horizontal/It has the desired effect. I believe it does use IE hacks, though. It's been awhile since I've actual looked at the code, so there may be more efficient/easier ways to do it.~Aphotic

I think you canwith java, but not with CSS. The scrollbar code you had above is a microsoft code, made for IE. FF doesn't support this, and niether do other non-IE/open source browsers. The code itself is not really CSS, although IE reads it.~Aphotic

I read an article on Project VII on how to do this, with little or no hacks. If you want a really good and reliable code, check out their site. http://www.projectseven.com/

body {background-color: #000000;margin: 0px;}a {color: #E55E5N;}a:visited {color: #86B300;}a:hover {color: #E2FF8A;}a:active {color: #E55E5N;} First, you need either 3 or 6 hexadecimals numbers, so replace your colors or add the correct number in "N". Also, W3C suggests that whenever you present the attribute "color" or "background-color", that you would follow it with its pair, i.e.: body {background-color: #000000; color: #FFFFFF; margin: 0px;} or a:hover {color: #E2FF8A; background-color: #000000;} Finally, adjusting your scrollbar is not actually a universal CSS property, it's actually a MS properties. Also, make sure that NONE of your code is in caps, for the exception of hexadecimals numbers. If you really want to, though, the proper code alteration for CSS2 for the scrollbar would be: body{scrollbar-face-color:#A2D800;scrollbar-arrow-color:#000000;scrollbar-track-color:#333333;scrollbar-shadow-color:'#000000';scrollbar-highlight-color:#NNNNNN;scrollbar-3dlight-color:#NNNNNN;scrollbar-darkshadow-Color:#NNNNNN;} Whereas "N" is replaced with the proper hexadecimals numbers for the color.Understand what I'm saying?~Aphotic

Give us the HTML too, I can't answer your question until I can see it.

Ok, for the first part I believe that W3 doesn't like changing scroll bars, and I'm not ven sure it they make them valid anymore. Does it work, though? If it doesn't work then there is a logical solution somewhere. The second problem is one that I've had before too. The solution I used was to use the background property in the definition of each part of the link properties, i.e.:a:active {color: #00FFFF;backgground-color:#000;}Try using "tansparent" to keep you bg image undisturbed.~Aphotic

I would say use a centering method using containers, one for the top and one for the bottom. Do you want the style to be similar to the current one? Centering the whole page would make it easier, but it's up to you. There are ways of using fixed units, but that has better results with a fixed sized template, usually centered. But before I confuse you (or myself, for that matter) with babbling, I think the best answer is with the two containers.

There are actual ways to get IE to understand hover effects in CSS, but it requires a tiny little hack. I think that there is another (recent) topic about it here that shows you exactly. As to the first question, another solution, which youmay not like sbrownii, as I really don't either, is to use an image. The things we have to do for stupid browsers....~Aphotic

Im my experience (which is limited, granted), PHP would probably be the easiest and best for you to learn. But before this topic becomes totally off-topic, let me say that there will be plenty of HTML and CSS work with practically any code you use, so stop by then when you need help. I may add that you might want to travel to the PHP or any other Server Script parts of this forum, where there is an abundancy of info and people to help you.Peace,Aphotic

Does it have to be a slideshow? Or is it just for a way to display pictures? There are some cool Pure CSS and HTML thumbnail-like code tht could be used...

That's probably the best way for you to go, as it usually takes less code and therefore reduces file size.

That's the way it looks. But maybe they'll decide gradient is good for design and through it in, in future releases, that is.

I think that it may be a possibility. But like boen_robot said, not in CSS3. Maybe in CSS4, as long as we complain enough .

You want a gradient border?

Make sure that your background isn't covered. If you, for example, use a container to center you site, and in your container div, it is coded to have a solid bg color, i.e. black, then that will cover it. Understand?

Thanks, sbrownii, that is exactly what I meant.

Here's your problem, because the way it's made, long words like that will "beak-out" of your set sizes. It should work fine if you input actual text in, or just a filler, like Lorem Ipsum.Right now in your HTML it's: <div id="left"><p>test left aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p></div> Try something like this: <div id="left"><p>test left Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean in elit. Sed venenatis iaculis ligula.</p></div> Or less to make sure.~Aphotic

Hey, my question is a pretty simple one, what are the benifits of using pixels or em's? Is it better to use one throughout the whole code? I sometimes find myself using both in the same code, because I create many images for my sites, too, and in doing so I've developed a strong understand of pixels and relationships. With em's, though, it seems like it's almost an estimate. Is there a ratio in which so many pixels equal 1 em? I thought I read somewhere that there are other units, too, but that might've been either different variants on code or for something completely different. Does it develop into pretty much a personal preference on using them, or does W3 want toconvert the whole web into using this. It seems that they are both valid, which is what raises the question to me. Oh, and if you don't think this is relevant to CSS, it is.~Aphotic

But don't forget to add "text-align: left" in a the table/div itself if you want your text alligned left again, otherwise it'll be centered.~Aphotic

Thank you very much. I fixed it so that the images are now backgrounds. I was under the impression before that it won't show without content (i.e. text), but by adding the height and width, it works properly now. In doing so, the break space was corrected, and it looks much better now. Thank you. I will continue to tweak the correct code.~Aphotic

Hey all. I've been coding with XHTML and CSS for about a year now, and because I hadn't found this site until recently, I've let some of my questions die out. Right now I'm wondering if you all can help me a little bit on a site I'm re-designing. It's pretty bare bones at te moment, because I want to have a secure code in place before I input actual information. Anyway, the site so far can be view at Freeby Friends. The real purpose of me posting this topic is for help on three things: fixing the boxes, adding side borders, and optimizing my CSS file.I want to first address the boxes. Currently, I have 4, all with the same basic structure. The HTML is as follows (I will show just one): <div id="box2"><div id="box2top"><img src="images/box2top.gif" alt="" title="Links" /></div><div id="box2cen">Morbi egestas elit eget dolor. Ut eros urna, molestie vel, rutrum at, ultricies quis, arcu. Ut eros urna, molestie vel, rutrum at, ultricies quis, arcu.</div><div id="box2bot"><img src="images/box2bot.gif" alt="" title="Links" /></div></div> And the corresponding CSS is: #box2{ padding-bottom: 7px;}#box2top{ /*background-image:url(images/box2bg.gif);*/}#box2top img{ border: 0px; width: 190px; height: 30px;}#box2cen{ background-image:url(images/box2bg.gif); padding-left: 10px; padding-right: 10px;}#box2bot img{ border: 0px; width: 190px; height: 12px;} On the site itself there are (At least in Firefox 1.5, this problem doesn't occur in IE for me) lines, breaks, really, between the box2top and box2cen, and the reaswon for this escapes me. If anyone can spot the flaw, please tell me. As a temp fix, I added: #box2top{ background-image:url(images/box2bg.gif);} Which fixes the problem visually, but creates a rought top.My next problem is creating a simple, one pix black border to the left and right of my container division tag. The CSS reads as follows: #container{ width: 735px; margin-left: auto; margin-right: auto; text-align: left; border-right: 1px solid #000000; border-left: 1px solid #000000;} The reason for this to not work also escapes me. If it is something simple, please excuse my ignorance.Finally, I was wondering if anyone could help me optimize my CSS and XHTML code itself. I would appreciate it very much so. The link to the actual CSS is CSS Code.Thanks,~Aphotic

Try changing the widths to set units, specifically the td. You could (which I really do suggest) use division tags rather than tables, but I don't know if you'll want to spend the time.~Aphotic

I may include that load time is affected greatly when you use tables. Unlike division tags, tables wait until the whole table is loaded before displaying. Division tags display as the code is read, which IMO, added with the smaller file sizes because of less code (which also helps with quicker load time) is enough in its own to use division tags and CSS.~Aphotic