General CSS Thread

[Miluette]

CSS is good. CSS has been kind to me!

But sometimes you wonder why it does strange things. You wonder why, when you tell a div that all its links are going to be at 0.7 opacity, only one of the links in the div complies to that rule - especially when another div with similar properties is doing as it should.

And you wonder why overflow:auto never ever seems to work. Any idea why it wouldn't?

(I'm to give you very specific examples very soon)

[reign16]

what do you mean of Generic CSS??why there are branded and generic comes to CSS code?

ADMIN: SIGNATURE DELETED! Don't spam SEO sites here!

[Databits]

It's probably because CSS is one of them things that, despite there being a standard, is still caught in the middle of a browser war. Everyone things certain things should work the way they do it, rather than the way it's specified. MS is notorious for doing this.

[Miluette]

I just discovered something about my new CSS'd Project Wonderful adbox on Millennium... it looks exactly how it should in Firefox, but nowhere else. Observe: http://millennium.senshuu.com/info.php (but not the main page 'cause I changed something there and am instead trying to center everything without the container box, which I think is the source of the problem e_e;;;;`)

[Miluette]

I have the feeling my container divs cause more headaches than they should. With the aforementioned issue, I know the width of my container related to the problem. Make the container less wide? Messed up. Make it wider? Also messes up. Don't define a width at all? Way messed up. Whoa. I resolved to take out an element I started feeling was "extra" and let it be all weird and off-center until I decide to relocate the ad box or something. :B


I've been using a 100% table height trick for a few websites. http://apptools.com/examples/tableheight.php This one. It only works sometimes. For example, it doesn't work on Millennium's site, except in the archives pages. And when I implement it into my code for Smackjeeves/Drunkduck mirrors, weird things happen. WEIRD. But it wasn't really needed at those sites, anyway.

http://senshuu.com/temp/tcc/ This site I'm working on for someone neither does 100% width nor height well. When I had only one green bar stretching the full width of the page it was fine, but now they both stop short and cause horizontal scrolling... strangely. Also, the main content area doesn't go the full height. If I only specify borders for its left and right, it definitely does not touch top-bottom edges. Used to have a lot of extra space below it for some reason, too (I really don't get when my sites do that).

Mmm, overcoming design hurdles. Any assistance with these issues is appreciated. <3

[Xepher]

I fixed the forms...
And I fixed the wordpress...

CSS can go DIAF :-P


In all seriousness, I'm just not that good with CSS issues. Sorry!

[Miluette]

LOL, and I can understand that!

Unlike all those other things, CSS is my buddy... it just acts up on me sometimes. Presenting itself to me one way in one browser, and being another way in the next browser! (But this one last problem I had actually occurs in all of them, whoopsie)

[yny-u]

Test in multiple browsers.. Always test in multiple browsers.

Yahoo has a library of CSS styles that goes some way to neutralizing these cross-browser issues. It has a few quirks, but it can save a lot of trouble.. http://developer.yahoo.com/yui/reset/

Hope that helps.

[Miluette]

Oh yeah, that reminds me, I'm looking into obtaining a CSS reset stylesheet or two. It'd probably help sometimes. I'm getting used to how different browsers handle things more now. (Today I found out Sunrise and Camino? Not that great.)