开发者

Create two column footer Using div?

How do I create a two column footer using div only? (tableless)

The footer is 开发者_Go百科980px it should contain....

Copyright 2010 xyz.com (left side)

About us | privacy | terms (right side)


You can do it something like this:

CSS:

.Footer_outer{
width: 980px;
border: 1px solid;
}

.Footer_inner_left{
width: 49%;
Float: left;
display:inline;
}

.Footer_inner_right{
width: 49%;
Float: right;
display:inline;
}

HTML:

<div class="Footer_outer">
  <div class="Footer_inner_left">Copyright 2010 xyz.com </div>
  <div class="Footer_inner_right">About us | privacy | terms </div>
</div>


In your css:

#footerLeft { width: 47%; float: left; display: block; 50px;}
#footerRight { width: 47%; float: right; display: block; height: 50px; }
#footer { width: 100%; height: 100% width: 980px; }

Html:

<div id="footer">
<div id="footerLeft">Copyright 2010 xyz.com</div>
<div id="footerRight">About Us | Privacy | terms </div>
</div>

Check out http://www.blueprintcss.org/ Framework, it will make life easier.


css:

#footer { overflow:hidden; width:980px; margin:0 auto; }
#footer #copy { float:left; display:inline; width:490px; }
#footer #links { float:right; display:inline; width:490px; }

html:

<div id="footer"><div id="copy">copyr..</div><div id="links">blah</div></div>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜