That would make life difficult wouldn't it?
Hi, I'm a little stumped here why IE would display correctly and Fx won't.
Much easier to realize that IE wouldn't, and firefox is.
per box model spec., as it should.
The left menu text breaks out of its div and runs into the content div when enlarges text in Fx.
Because you told them to?:
Also, the content div and the header nav div run out of the main div onto the right of the screen.
100% + 170px + 5px + 10px + 10px = 100% width + 195px.
border:1px #A6A6A6 solid;
margin: 5px 5px 10px 170px;
padding: 10px 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
Remove the width:100%; fixed
Remove white-space: nowrap;
display: table; /* ignored by IE */
white-space: nowrap; /* keep text on one line */
border: none; /* add a border to show size of menu */
font-family: Arial, Helvetica, sans-serif;
Maybe put this on each anchor instead so "Secretary of State" etc. won't break in the middle, but allow the container to grow for multiple lines... No height on either s0s-row, or nav-header
There's only so much room per line... paragraphs do the same thing. See above.
Also, the search float gets pushed onto the next line.
I assume IE works only because there's only so far you can enlarge in IE vs. Fx's wider range. I have used a few hacks and I hope they do not conflict. Any ideas are greatly appreciated.
I'm guessing you tested in IE as you were designing?
Otherwise you might be asking why it was broken...
IE expands containers to fit their content, instead of allowing the content to overflow the edge as it should.
Try the page with your browser at an 800px width.. then set text to largest. Now IE runs off the side of the page....
Also, there's no font color set other than a few specific areas. I had to set the color before I could see the main body text.. it was white on white for me.
Edit to add: You also need a full doctype declaration, it's only partial now, so IE is in quirks mode...