How do i have a space between my menu header and my body of text? Also is this good practice?
div.body
{
width: 6.5in;
margin:0px auto;
text-align:left;
}
.menu ul{
margin:0px auto;
}
.menu li{
width: 25%;
text-align:center;
display:block;
float:left;
}
.menu a{
display:block;
}
html:
<html>
<head>
<link rel="stylesheet" type="text/css" href="my.css" />
</head>
<body>
<div>
<div class="menu">
<ul>
<li><a href="">Home</a></li>
<li>Test</li>
<li>Test 2</li>
<li>Contact</li>
</ul>
</div>
</div>
<div class="body">
lots of textlots of textlots of textlots of textlots of textlots of textlots of textlots of text
<the above repeated many times>
</div>
</body>
</html>
From stackoverflow
-
Set top margin on your body of text:
div.body { width: 6.5in; margin: 10px auto 0px auto; text-align: left; }Mark : fyi, this solution centers the bodyMark : and of course you can use padding, or a margin-bottom on the menu depending on your needsfandelost : ..or an invisible/blended-with-background border, useful under some circumstances where spacing would mess things up.
0 comments:
Post a Comment