I am new to Umbraco and this is my second site using it. The problem I am having is that there is a white space/margin between the master page and where my content begins. I wish to eliminate most or all of that space but regardless of what I place in my CSS I can not get rid of it.
Here is the page. I am trying to eliminate the space directly below the blue menu and above the site content.
Top margin of pages
I am new to Umbraco and this is my second site using it. The problem I am having is that there is a white space/margin between the master page and where my content begins. I wish to eliminate most or all of that space but regardless of what I place in my CSS I can not get rid of it.
Here is the page. I am trying to eliminate the space directly below the blue menu and above the site content.
http://new.newlisbonchamber.com/
Here is my CSS
body { MARGIN: 0px; Padding: 0px; FONT-FAMILY: sans-serif; FONT-SIZE: 12px; COLOR:#333333; background-color:#FFFFFF; }
#wrap-content {width: 740px; margin: 10px auto; padding: 0 5px; background-color: #FFFFFF; margin-top: 0px; }
#content-main {margin-top: 0px; margin: 0px; Padding: 0px;}
#content-main-top { height: 10px ;}
.smalldefault {font-size:11px; font-family:Arial;}
.menutable { background-color:#101C5D; padding: 5px 15px 5px 15px; }
.menutableNoBanner { background-color:#101C5D; }
.HomePageContent { background-color:#A5BFE0;}
.HomePageCell { background-color:#FFFFFF; border-top: solid 10px #101C5D; border-bottom: solid 1px #101C5D; border-left: solid 1px #101C5D; border-right: solid 1px #101C5D;}
.PageContentCell { background-color:#FFFFFF; border-top: solid 5px #101C5D; border-bottom: solid 1px #101C5D; border-left: solid 1px #101C5D; border-right: solid 1px #101C5D;}
.BecomeAMember { background-color:#8AA2C8; color:#101C5D; border: solid 1px #101C5D;}
.PageContent { background-color:#DBE5F3;}
/* textpage -- */
#textpage { padding: 10px 10px ; margin-top: 0px;}
A { COLOR: #CE1E20; text-decoration:underline;}
A:hover { text-decoration:none;}
A.HomePageCellLink { color:#CE1E20; text-decoration:underline; FONT-SIZE: 10px;}
A.HomePageCellLink:hover { text-decoration:none;}
A.Link { color:#CE1E20; text-decoration:underline; FONT-SIZE: 11px;}
A.Link:hover { text-decoration:none;}
A.LinkFooter { color:#FFFFFF; text-decoration:underline; FONT-SIZE: 11px;}
A.LinkFooter:hover { text-decoration:none;}
A.menu { COLOR: #FFFFFF; text-decoration:none; font-size:11px; font-weight:bold; }
A.menu:hover { COLOR: #CCCCCC; text-decoration:underline; }
A.PageSubMenuLink { color:#CE1E20; text-decoration:underline; FONT-SIZE: 11px;}
h1.HomePageCellHeading { COLOR: #93A333; text-decoration:none; FONT-SIZE: 14px; font-weight:bold;}
h1.PageContentHeading { COLOR: #93211D; text-decoration:none; FONT-SIZE: 16px; font-weight:bold;}
h2.PageContentSubHeading { COLOR: #93A333; text-decoration:none; FONT-SIZE: 14px; font-weight:bold;}
h3.BusinessSubHeading { COLOR: #000000; text-decoration:none; FONT-SIZE: 12px; font-weight:bold;}
div.RedAlert { background-color: #FFF0F0; border: 1px solid #D17171; padding: 5px 10px 8px 10px; margin: 1em 0 0 0; }
.errorRed, a.errorRed, a.errorRed:visited, .errorRed a, .errorRed a:visited { color: #f00; }
Thanks Much
Ron
Remove the content-main-top div as it is empty.
Change the padding of #textpage and change the margin on your paragraph (<p>) elements and you're done.
Have a look at Firebug for Firefox, read a tutorial or two about how you can use it and that will definitely ease some of your CSS pain.
Sebastiaan,
Thanks Much for the help. Got it now.
Ron
is working on a reply...
This forum is in read-only mode while we transition to the new forum.
You can continue this topic on the new forum by tapping the "Continue discussion" link below.