Header is escaping from "div" container. [Archive]

alakbd

10-10-2012, 06:45 PM

Hi all,
I am having little trouble here with my website "Header". I assume it is related to margin-top. And it is happening only with firefox. In IE9 and google chorme it works fine.Here is my test website http://www.dublinawamileague.net46.net/Adhocommittee.html . Please view this with "Firefox" then you can find wheres the problem is ? This website header is escaping from the containg div. I tried to fix that with giving
<div margin-top: -15px> after the <body> but it didnt work.

On the top of this page in element selector I also tried to balance this with

/* ~~ Element/tag selectors ~~ */

h1, h2, h3, h4, h5, h6, p {
margin-top: 0; /* removing the top margin gets around an issue where margins can escape from their containing div. The remaining bottom margin will hold it away from any elements that follow. */
padding-right: 15px;
padding-left: 15px; /* adding the padding to the sides of the elements within the divs, instead of the divs themselves, gets rid of any box model math. A nested div with side padding can also be used as an alternate method. */
} . But it didnt work too.Is there any way that I can fix this. I have few pages in this website that I gotta fix for "Firefox" viewer. Can you please help.

Thanks & Regards,
Alak

molendijk

10-10-2012, 07:20 PM

I remember a similar question was asked not long ago. The trick was to put<br> before the escaping element.
In your case, try to put <br> before <div class="container" ....
(Firefox sometimes treats divs as inline elements that are seen as block elements by other browsers).
Arie Molendijk.

alakbd

10-11-2012, 06:17 PM

Thanks Molen, Yes, it has been asked before but that was sorted out without given any <br>. It was margin-top-15px. So I was thinking there might be less or more points need to be added with that may be -20px or -10 px. But the above error has been sorted out with <br>. Thanks again.