Is there some easy way to align stuff in div containers to the right or bottom:
<div class="span-24 align-right last">Text appears on the right side of the layout</div>
or:
<div class="span-2" id="lots-of-content"></div><div class="span-22 last bottom">Appears at bottom of container</div>
or:
<div class="span-24 vertical-middle last">Middle of the container</div>
Here's a sample of what I'm working with trying to position the "topnav" below:
<div class="container">
<div class="span-16">
<h1>Header</h1>
</div>
<div class="span-8 last vertical-middle">
<div id="topnav" class="align-right"><input type="button" id="register" class="ui-button ui-state-default ui-corner-all" value="Register" /> or <button type="button" id="signin" class="ui-button ui-state-default ui-corner-all">Sign in</button></div>
</div>
<hr />
...
</div>
Use
position: absolute
. For example:Note that for
vertical-middle
, this will center the top edge of the content, no the content itself.Make sure that the containing
DIV
isposition: relative
to force it to become the offset parent (which the position of the children are relative to) EDIT: In other words, add the following rule: