PDA

View Full Version : Magrins are failing me.



loserWILL
19-12-2007, 01:42 AM
I've finished coding my layout, but my margins are failing me. They're just a scattered mess. If you can fix it up, or tell me what's wrong, that'd be great. +rep too. Here's my code:


<style type="text/css">

body {
background-image: url(images/bg.gif);
margin-top: 0;
font-family: "Trebuchet MS";
font-size: 12px;
}

body a:link {
text-decoration: none;
}

body a:hover {
text-decoration: none;
font-weight: bold;
}

#banner {
background-image: url(images/banner.gif);
align: center;
width: 800px;
height: 155px;
}

#navigation_wrap {
width: 166px;
float: left;
margin-top: 33px;
margin-left: 58px;
}

#content_wrap {
width: 439px;
margin-top: 33px;
margin-left: 58px;
}

#copyright_wrap {
width: 658px;
}

#navigation_top {
background-image: url(images/navigation_top.gif);
width: 166px;
height: 35px;
}

#navigation_middle {
background-image: url(images/navigation_middle.gif);
width: 166px;
}

#navigation_bottom {
background-image: url(images/navigation_bottom.gif);
width: 166px;
height: 11px;
}

#content_top {
background-image: url(images/content_top.gif);
height: 35px;
width: 439px;
}

#content_middle {
background-image: url(images/content_middle.gif);
width: 439px;
}

#content_bottom {
background-image: url(images/content_bottom.gif);
height: 11px;
width: 439px;
}

#copyright_top {
background-image: url(images/copyright_top.gif);
height: 35px;
width: 658px;
}

#copyright_middle {
background-image: url(images/content_middle.gif);
width: 658px;
}

#copyright_bottom {
background-image: url(images/copyright_bottom.gif);
width: 658px;
height: 11px;
}

</style>

</head>

<body>

<!-- the banner -->
<div id="banner"></div>

<!-- the navigation divs -->
<div id="navigation_wrap">
<div id="navigation_top"></div>
<div id="navigation_middle">yip i ay.</div>
<div id="navigation_bottom"></div>
</div>

<!-- the content divs -->
<div id="content_wrap">
<div id="content_top"></div>
<div id="content_middle"></div>
<div id="content_bottom"></div>
</div>

<!-- the copyright div - DO NOT REMOVE! -->
<div id="copyright_wrap">
<div id="copyright_top"></div>
<div id="copyright_middle"></div>
<div id="copyright_bottom"></div>
</div>

Moved by Agesilaus (Forum Moderator) from Design and Development: Please post in the correct forum.

loserWILL
19-12-2007, 02:01 AM
I can't edit - Please use the following code instead:

<style type="text/css">

body {
background-image: url(images/bg.gif);
margin-top: 0;
font-family: "Trebuchet MS";
font-size: 12px;
}

body a:link {
text-decoration: none;
}

body a:hover {
text-decoration: none;
font-weight: bold;
}

#banner {
background-image: url(images/banner.gif);
align: center;
width: 800px;
height: 155px;
}

#navigation_wrap {
width: 166px;
float: left;
margin-top: 33px;
margin-left: 58px;
}

#content_wrap {
width: 439px;
margin-top: 33px;
margin-left: 58px;
}

#copyright_wrap {
width: 658px;
}

#navigation_top {
background-image: url(images/navigation_top.gif);
width: 166px;
height: 35px;
}

#navigation_middle {
background-image: url(images/navigation_middle.gif);
width: 166px;
}

#navigation_bottom {
background-image: url(images/navigation_bottom.gif);
width: 166px;
height: 11px;
}

#content_top {
background-image: url(images/content_top.gif);
height: 35px;
width: 439px;
}

#content_middle {
background-image: url(images/content_middle.gif);
width: 439px;
}

#content_bottom {
background-image: url(images/content_bottom.gif);
height: 11px;
width: 439px;
}

#copyright_top {
background-image: url(images/copyright_top.gif);
height: 35px;
width: 658px;
}

#copyright_middle {
background-image: url(images/content_middle.gif);
width: 658px;
}

#copyright_bottom {
background-image: url(images/copyright_bottom.gif);
width: 658px;
height: 11px;
}

</style>

</head>

<body>

<!-- the banner -->
<div align="center">
<div id="banner"></div>
</div>

<!-- the navigation divs -->
<div id="navigation_wrap">
<div id="navigation_top"></div>
<div id="navigation_middle">yip i ay.</div>
<div id="navigation_bottom"></div>
</div>

<!-- the content divs -->
<div id="content_wrap">
<div id="content_top"></div>
<div id="content_middle"></div>
<div id="content_bottom"></div>
</div>

<!-- the copyright div - DO NOT REMOVE! -->
<div align="center">
<div id="copyright_wrap">
<div id="copyright_top"></div>
<div id="copyright_middle"></div>
<div id="copyright_bottom"></div>
</div>
</div>

loserWILL
19-12-2007, 09:33 PM
bump. ^_^

Edited by opensourcehost (Forum Super Moderator): Please do not multiple post.

Chippiewill
20-12-2007, 10:57 AM
Try not to bump unless over a day, the mods normally understand that

Also on your behalf, mods i think he meant the name of the thread to be:

Margins are failing me

I think it was a typo

loserWILL
20-12-2007, 10:07 PM
Thanks for the above post?

I really need this, does anybody know why they aren't working?

Want to hide these adverts? Register an account for free!