Hi All, I just changed it from what I just said to adding a:
padding: 1px 0; /* This is needed to get rid of the "escaping margins". Just add a 1px padding-top and padding-bottom to the div.*/ to the #main_content div. This seemed a bit cleaner and allows me a bit more flexibility with my P and Hn rules. Thanks again. Mark ----------------------------- On Jul 9, 2007, at 6:54 PM, Mark Wheeler wrote: > Hi David, > > Thanks for the education. I just googled it and came across this link: > > http://www.communitymx.com/abstract.cfm?cid=CB7B3 > > Thanks for the push in the right direction. I've made the changes to > css file. You can see the changes now. > > http://dev.tonedeafdesign.com/ob/test.html > http://dev.tonedeafdesign.com/ob/css/global.css > > I just added: > > p, h1, h2, h3 { > margin: 0; > padding: 5px 0; > } > > And that tightened everything up. > > Thanks again, > > Mark > > ------------------------------------------ > > On Jul 9, 2007, at 6:24 PM, David Hucklesby wrote: > >> On Mon, 9 Jul 2007 11:17:05 -0700, Mark Wheeler wrote: >>> Hi all, >>> >>> I'm trying my first liquid layout and have run into a couple of >>> snags. Forgive me if >>> I'm totally going about this the wrong way, but I had to start >>> somewhere. First, here >>> are the links: >>> >>> http://dev.tonedeafdesign.com/ob/test.html >>> http://dev.tonedeafdesign.com/ob/css/global.css >>> >>> The problem is that there is a space above and below my >>> #main_content div when I place >>> a <p> or an <h1,2,3> tag in the first or last part of the >>> content. This is happening >>> in IE6, IE7, FF and Safari. The weird thing is when place a >>> visible border around >>> #main_content, that all goes away and things act as I expected. So >>> what am I missing >>> here? Below is the css for the #main_content div. Uncomment the >>> border to see what I >>> mean. >>> >> >> I think you are referring to "escaping margins." >> Google "css escaping margins" for an explanation. >> >> Basically, the top and bottom margins of your Hn or P elements >> "escape" through the top and bottom of your DIV. Adding a border >> or padding to the top and bottom of your DIV will "block" them. >> >> Cordially, >> David >> -- >> > > ______________________________________________________________________ > css-discuss [EMAIL PROTECTED] > http://www.css-discuss.org/mailman/listinfo/css-d > IE7 information -- http://css-discuss.incutio.com/?page=IE7 > List wiki/FAQ -- http://css-discuss.incutio.com/ > Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
