css error or firefox bug?? (Full Version)

All Forums >> [Web Development] >> Cascading Style Sheets



Message


d a v e -> css error or firefox bug?? (8/21/2004 4:07:06)

if you look at
http://members.surfeu.fi/dave_pirjo/test-area/lara/template.htm
(rough stage at the moment)

there is a space missing in between menu items in fireofx/moz but not in any other browser (not even IE!)

increasing text size (via browser) brings the dividing line/space back but go larger and it disappears again.

html and css are valid and i am beginning to think it's a browser bug. adding more random menu items will result similar thing happening again further down.

thanks for any thoughts

[image]local://upfiles/5827/2870CC9DC24E4F1893EEE9152EACA4E8.gif[/image]




Giomanach -> RE: css error or firefox bug?? (8/21/2004 4:53:19)

IS the image how it's supposed to look? If so...I can't see anything wrong

Dan




d a v e -> RE: css error or firefox bug?? (8/21/2004 4:58:55)

supposed to be a space/line between 'Styrelsemedlemmar' and 'Skolombud' in the middle of the pic, like between the other buttons




Giomanach -> RE: css error or firefox bug?? (8/21/2004 5:16:42)

So I'm looking at this:

<td id="leftTd"><div id="navcontainer">
      <ul id="navlist">
        <li><a href="index.htm">Startsida</a></li>
        <li><a href="verksamheten.htm">Om verksamheten</a></li>
        <li><a href="styrelsemedlemmar.htm">Styrelsemedlemmar</a></li>

        <li><a href="skolombud.htm">Skolombud</a></li>
        <li><a href="fortroendeman.htm">Förtroendemän</a></li>
        <li><a href="aktuellt.htm">Aktuellt</a></li>
		 <li><a href="fotoarkiv.htm">Fotoarkiv</a></li>
        <li><a href="lankar.htm">Länkar</a></li>       
      </ul>
    </div></td>


And this:

#navcontainer
{
width:15em;
border-right: 1px solid #333;
border-bottom: 1px solid #333;
padding: 0 0 1em 0;
margin-bottom: 1em;
font-family: Verdana, Geneva, Helvetica, Arial, sans-serif;
background-color: #98bccc;
color: #333;
}

#navcontainer ul
{
list-style: none;
margin: 0;
padding: 0;
border: none;
}

#navcontainer li
{
border-bottom: 1px solid #98bccc;
margin: 0;
}

#navcontainer li a
{
display: block;
padding: 5px 5px 5px 0.5em;
border-left: 10px solid #006d99;
border-right: 10px solid #65afcc;
background-color: #0099cc;
color: #fff;
text-decoration: none;
width: 100%;
}

html>body #navcontainer li a { width: auto; }

#navcontainer li a:hover
{
border-left: 10px solid #fef000;
border-right: 10px solid #98bccc;
background-color: #65afcc;
color: #fff;
}
.current 
{padding:5px;
border-left: 10px solid #fef000 ;
border-right: 10px solid #98bccc;
background-color: #65afcc;
color: #fff;
}

If I could see something wrong, I'd let ya know...but I can't....must be FF...cos it's the same here..and in M1.7 and NN7.1




c1sissy -> RE: css error or firefox bug?? (8/21/2004 8:56:32)

Dave, I have two suggestions of where you could look for an answer.

Go to listamatics site, they have tons of things on there that might help you out. And for some bugs for IE, go to positioniseverything site. Go through BigJohns site as he has a ton of information on bugs in there that might help you out.

Always remember, just because your code does validate, that doesn't mean that you are going to be problem free. I think your going to find that the problem is in IE rather then firefox. If you can't find anything on those two sites, let me know and I will see if I can find soemthing for you.




d a v e -> RE: css error or firefox bug?? (8/21/2004 9:10:33)

well it's fine in opera and ie it's only firefox that seems strange (unless of course it's FF that's right and IE that's wrong) but the fact that there's nothing different for those particular buttons makes me think it's a moz display thing and not anything particular to my code. i'll experiment with differnt length words etc and see if it's something to do with that affecting the space left for the containing block....

just tried with identical links same word, same link just like this

<li><a href="http://bbc.co.uk">testing</a></li>
        <li><a href="http://bbc.co.uk">testing</a></li>
        <li><a href="http://bbc.co.uk">testing</a></li>


and the same thing in some places...




caz -> RE: css error or firefox bug?? (8/21/2004 9:53:19)

Just to follow on from Deb, I get this from IE6

[image]local://upfiles/3479/524A51807A7F4120A6D3E6EE0F9EC6EA.jpg[/image]




caz -> RE: css error or firefox bug?? (8/21/2004 9:54:38)

And this from FF0.8

[image]local://upfiles/3479/455DF3FBAC7043A29A11CDC33AD33C47.jpg[/image]

Looking at it through the Accessibilty Tool for IE shows that positioning of the Main Content may be a problem there as well. I'm just guessing because I am not familiar with using tables with CSS.

That tool is very useful for giving a graphic view of elements if you are a visual type- I have to say, though it pains me, that it is as good as the webdev toolbar in FF. Even a little better because it gives eye condition simulations too.[8|]




d a v e -> RE: css error or firefox bug?? (8/21/2004 10:00:31)

oh i just changed the rule for the bottom border on the li's to border-top
#navcontainer li
{
border-top: 1px solid #98bccc;
margin: 0;
}


and this fixed it, did you take your screen shot before or after? i did it about 15 mins ago




caz -> RE: css error or firefox bug?? (8/21/2004 10:05:24)

Must have been before, because it is fixed on both for me now.
Good practice though, eh?
Cheers
[:D]




Page: [1]

Valid CSS!




Forum Software © ASPPlayground.NET Advanced Edition 2.4.5 ANSI
0.046875