Mon, 2004-01-12 09:49
I've got a div that is 50px high and 750px wide. I've got a pic that I want to be aligned in the bottom left of the div and some info that I want to be aligned in the bottom right of the div. Here's the code:
<div id="copyright"> <a href="http://validator.w3.org/check/referer" target="_blank"><img align="left" src="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0!" height="31" width="88" border="0"/></a> <span>©2003 - <a href="mailto:[email protected]">[email protected]</a></span> </div>
#copyright {
color: #ffffff;
height: 50px;
margin-left: 2px;
margin-right: 2px;
padding: 0px;
margin-top: 0px;
margin-bottom: 0px;
}
#copyright span{
margin-top: auto;
margin-left: auto;
margin-right: 0px;
margin-bottom: 0px;
}
#copyright a {
color: #ffffff;
font-weight: bold;
}
Any suggestions?
Tue, 2004-01-13 00:58
#1
Vertical aligning in the bottom of a div
Quite easy, actually. I added the "float" line to the code. Here's the snippet:
#copyright span{
float: right;
margin-top: auto;
margin-left: auto;
margin-right: 0px;
margin-bottom: 0px;
}