1 reply [Last post]
FishStickey
Offline
newbie
Lommel
Last seen: 15 years 47 weeks ago
Lommel
Timezone: GMT+1
Joined: 2004-01-12
Posts: 2
Points: 0

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>&copy;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?

smaragd
Offline
newbie
Last seen: 15 years 48 weeks ago
Timezone: GMT+1
Joined: 2004-01-04
Posts: 2
Points: 0

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;
}