Help | Site Map
Connecting Tech Pros Worldwide
 
 
LinkBack Thread Tools
  #1  
Old October 5th, 2005, 09:28 PM
PJ
Guest
 
Posts: n/a
Default Align LeftBottom and Right

I have two blocks, one aligned to the left and one aligned to the right.
I'm having issues getting the left block aligned to the bottom when the
content height is less than that of the right block. How do I accomplish
this w/out using a table? Thanks. - PJ

<div class="clearfix">
<div class="floatleft">
<p>some text that I'd like bottom aligned with Link 3</p>
</div>
<div class="floatright">
<p><a href="#">Link 1</a></p>
<p><a href="#">Link 2</a></p>
<p><a href="#">Link 3</a></p>
</div>
</div>


..floatleft {
display: block;
float: left;
width: 45%;
}
..floatright {
display: block;
float: right;
width: 45%;
text-align: right;
}

/* Clearfix */
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
..clearfix { display: inline-block; }
/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
..clearfix { display: block; }
/* End hide from IE-mac */


 

Bookmarks

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are Off
[IMG] code is Off
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

What is Bytes?

We are a network of experts and professionals in IT and software development that help one another with answers to tough questions and share insights. Get the best answers to your questions from over network members.
Post your question now . . .
It's fast and it's free

Popular Articles