Giuseppe Craparotta wrote:
> This styles seem to imply that in IE6 and 7 a clear grey border appears
> below the first 4 <li>'s, as you can see. It is actually the page
> background, not a border part of my design.
> In Firefox there's no grey between the boxes, which is the way it should
> be.
>
I wasn't able to fully test this so be sure to run it through the works
(you've got a width defined on the list items so floating them shouldn't
be a problem in say MacIE, etc - but it's always good to test). That
said, it works here at home in FF and IE7.
Added to your stylesheet:
ul {
overflow:hidden;} - make the float wrapper appear to encapsulate
it's floaty children ;)
li.odd, li.even {
float:left;} - the real meat of the fix, gets rid of that phantom
space under your list items.
You could also feed the li styles to only IE6and7 using something like
this in your <head>:
<!--[if gte IE 5.5000]>
<style type="text/css">
li.odd, li.even {
float:left;}
</style>
<![endif]-->
> Besides, when I increase the page's size, the works' button looses part
> of the blue.
>
> How can I get rid of these defects? Is something I do wrong?
>
Not quite sure what you mean. Perhaps you mean resizing the font?
1. Resizing the font in IE7 seems to resize your background as well
(although I'm not sure why; possibly an IE specific behavior there).
2. Resizing the font in Firefox goes as expected, the font height
eventually becomes greater than the height of your background image.
SCL
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
