登录 | 注册 | FAQ
Anonymous

my css

+ 发表回复

3 篇帖子 分页: 1 / 1


my css

term101 » 周三 12月 08, 2010 4:57 pm

Can anyone tell me why my body section is not correctly between my leftnav and rightnav when i view this?

HTML

<html>
<head>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>

<div id="container">

<div id="header">This is the header</div>

<div id="leftnav">This is the leftnav</div>

<div id="rightnav">This is the rightnav</div>

<div id="body">This is the body</div>

<div id="footer">This is the footer</div>

</div>

</body>
</html>

CSS

#container {

width: 900px;

}

#header {

width: 900px;
height: 100px;
background-image: url(images/headerimg.jpg);
border-bottom: 2px solid #000000;

}

#leftnav {

float: left;
width: 140px;
height: 400px;
background-color: #F8AA3C;
border-right: 1px dashed #694717;

}

#rightnav {

float: right;
width: 140px;
height: 400px;
background-color: #F8AA3C;
border-left: 1px dashed #694717;

}

#body {

width: 620px;

}

#footer {

clear: both;
background-color: #D1C0A7;

}
头像

term101

  • 帖子: 1
  • 注册: 周三 12月 08, 2010 4:54 pm

Re: my css

HTML.net » 周三 12月 08, 2010 11:19 pm

term101 写道:Can anyone tell me why my body section is not correctly between my leftnav and rightnav when i view this?


Your "cointainer"-div is 900px. So are the 3 columns (left, right and body) added together. Try to give it a bit of space: for instance set the width of the "body"-div to 600px (instead of 620px) - I think that will do the trick.

- Andreas, HTML.net

PS.
Consider renaming the "body"-div - it's a bit confusing - "content" might be a better name. Just a suggestion :)
头像

HTML.net
Site Admin

  • 帖子: 1194
  • 注册: 周六 9月 11, 2010 11:24 am
--
Show some love for HTML.net on Twitter, Facebook and Google: Use the buttons on top of all pages.

Re: my css

Veeramanikandan » 周三 5月 13, 2015 2:37 pm

give the header {
width:100% }
because container taken the 900px;
otherwise we not mention same value on header
头像

Veeramanikandan

  • 帖子: 20
  • 注册: 周一 9月 22, 2014 4:03 pm


+ 发表回复

分页: 1 / 1