Page 1 of 1
div align >> help !!
Posted: Mon Jun 30, 2008 9:01 am
by Monopoly
Lets say i have a <div> tag ...
How can I align some text to the left and some to the right within the same <div> tag ??
Thank you
Re: div align >> help !!
Posted: Mon Jun 30, 2008 10:07 am
by matthijs
Wrap something around the text (another div, span, em, etc) and use either float (left and right) or text-align. Which method to choose depends a bit on the content and the rest of the styling.
Edit: you can even use positioning. Again, depends on other aspects which method suits the situation
Re: div align >> help !!
Posted: Mon Jun 30, 2008 11:59 am
by Monopoly
Well , I tried wrapping the text with divs (I tried both float:left/right and text-align:left/right) but it results that the text on the right begins on the next line or some other unwanted results...Can you please show me a simple example how to do it ?
Re: div align >> help !!
Posted: Mon Jun 30, 2008 12:43 pm
by matthijs
Two examples would be
Code: Select all
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>untitled</title>
<meta name="generator" content="TextMate http://macromates.com/">
<!-- Date: 2008-06-30 -->
<style type="text/css" media="screen">
body { background:#eee;}
/* First example, using floats */
#container { width:800px;margin:20px auto;background:#fff;height:100px;}
.left { float:left;width:49%;}
.right { float:right;width:49%;text-align:right; }
/* second example, using positioning */
h3 { position:relative;}
h3 em { position:absolute;right:0;}
</style>
</head>
<body>
<div id="container">
<div class="left">
<p>Left text</p>
</div>
<div class="right">
<p>right text</p>
</div>
<h3>Some title <em>23/06</em></h3>
</div>
</body>
</html>
Re: div align >> help !!
Posted: Mon Jun 30, 2008 1:04 pm
by Monopoly
hmm , thanks , that cleared the problem for me
Another question : Is it possible to align divs from different vertical divs in column using the width attribute ?

Re: div align >> help !!
Posted: Mon Jun 30, 2008 1:32 pm
by matthijs
Yes, if I understand what you mean.