02-12-2005, 06:07 PM
I'm having a problem with the following page http://www.njsims.com/test.html
Basically I'm redesigning my site so I just whipped up a quick test of a nav idea (hence the inline style sheet). I looks fine in IE and Opera but in Firefox the height and width of the navbuttons defaults to the size of the text, rather than the size of the element in the css.
Both my html and my css validate.
Its really important that it renders correctly in firefox since they account for nearly 15% of my sites visitors.
02-12-2005, 06:22 PM
You have to use "display: block" on the anchors; links are inline by default, so the height and width is the height and width of the text, unless you make it a block-level element. Then you can give it whatever height and width you want.
What you're doing is pretty commonly marked up now as a unordered list... here's a great site that explains the whole process:
http://css.maxdesign.com.au/floatutorial/tutorial0613.htm (tutorial #6)
Hope this helps,
02-12-2005, 10:48 PM
or the other possible problem, u used pt instead of px for the font-size, doing this allows the browser to use the font size according to the default font size which varies across browsers, try using px instead, while still using the display block as previously suggested
02-13-2005, 10:16 AM
I put in the display:block and it worked great, except my tabs now stack one on top of the other :s any ideas how to get them back in a straight line?
02-13-2005, 10:31 AM
could try display:inline; instead haven't used it much, so i dunno if it will work or not
02-13-2005, 11:58 AM
with just the display:inline; in firefox it went back to not having the right height and wdith but I went with the <ul> route and it worked great!
02-13-2005, 07:15 PM
Yeah, I forgot to mention, once the height and width is assigned you have to get it to line up... the tutorials mentioned that, though. Glad you got it working!
02-14-2005, 04:11 PM
kinda related to that is it possible to stretch/shrink the background image to fit its contents?
02-15-2005, 11:52 PM
Try this link for some ideas of how to get one common background image(s) to resize and rollover.
Hope this helps,