I'm creating a new layout and I'm having some problems that I can't really explain. The page is here (<!-- m --><a class="postlink" href="http://www.esitenow.com/re/">http://www.esitenow.com/re/</a><!-- m -->)
1. The H1 in the header pushes the other divs down. Why doesn't it stay within it's own div which should have the correct height to contain it?
2. Probably has to do with the first answer, but why does leftcol and content stay put, but the slogan div moves down past it?
3. Unrelated, but the bottom border on the button is shorter than the top for no apparent reason.
BTW, most of this happens in Firefox, which leads me to believe I'm just not defining something I need to define.1. if it doesen't fit IE will adjust the contents, FF won't.
Remove height:100px from #header or adjust the heights of it's contents to be 100px.
At the moment it's contents is nearly 200px!
2.
but probably related to 1.
3. Border values of thin thick are different in browsers, use px
4. Menu list is smaller in FF. Add border:1px solid #98322f; to #navlistI see what your saying on the header. The reason it's that much is because of the line-height on the H1's. I'm using that to try to center the H1 with the image right beside it. It's not working though, and just making a bigger area above and below the H1 instead of centering it inside the div.Add style="text-align:center;" to the div to center h1for a vertical align?vertical align would be
{vertical-align: middle;}
or baseline, super, top, bottom, <a value> text-top etc...
::Edit:: err wait nvm I am thinking of something else sorry...yeah, that's already in the code. I did solve it, I added a clear:both to the slogan div under it. Why that fixed the problem, I don't know.
1. The H1 in the header pushes the other divs down. Why doesn't it stay within it's own div which should have the correct height to contain it?
2. Probably has to do with the first answer, but why does leftcol and content stay put, but the slogan div moves down past it?
3. Unrelated, but the bottom border on the button is shorter than the top for no apparent reason.
BTW, most of this happens in Firefox, which leads me to believe I'm just not defining something I need to define.1. if it doesen't fit IE will adjust the contents, FF won't.
Remove height:100px from #header or adjust the heights of it's contents to be 100px.
At the moment it's contents is nearly 200px!
2.
but probably related to 1.3. Border values of thin thick are different in browsers, use px
4. Menu list is smaller in FF. Add border:1px solid #98322f; to #navlistI see what your saying on the header. The reason it's that much is because of the line-height on the H1's. I'm using that to try to center the H1 with the image right beside it. It's not working though, and just making a bigger area above and below the H1 instead of centering it inside the div.Add style="text-align:center;" to the div to center h1for a vertical align?vertical align would be
{vertical-align: middle;}
or baseline, super, top, bottom, <a value> text-top etc...
::Edit:: err wait nvm I am thinking of something else sorry...yeah, that's already in the code. I did solve it, I added a clear:both to the slogan div under it. Why that fixed the problem, I don't know.