0

index.html

<h4>Latest News</h4>
<p style="border-bottom: 2px dotted #FF0000; width: 620px;"></p><br />
		<div class="post">
						
            <img src="images/pic1.png" ALT="picture1" ALIGN=LEFT><div id="ptitle">Lorem ipsum <div id="pdate">- 14 Jan 2011</div></div><p> 
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce porta diam in quam consectetur elementum. Vestibulum iaculis pellentesque mauris, non sodales erat egestas nec. Proin sed elit sed ligula ullamcorper adipiscing. Quisque pellentesque sapien odio. Phasellus nec elit ligula. Ut tempus urna ut lectus ullamcorper imperdiet. Quisque vitae massa sem, sed cursus sapien. Ut mi lorem... <a href="#">read more ></a></p>
<p style="border-bottom: 2px dotted #FF0000; width: 700px;"></p><br />

style.css

#content #main .post #ptitle {
	font:Arial, Helvetica, sans-serif; font-size: 14px; color:red;
	}
			
#content #main .post #pdate {
	font:Arial, Helvetica, sans-serif; font-size: 14px;
	}

The print out:

Lorem ipsum
- 14 Jan 2011
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce porta diam in quam consectetur elementum. Vestibulum iaculis pellentesque mauris, non sodales erat egestas nec. Proin sed elit sed ligula ullamcorper adipiscing. Quisque pellentesque sapien odio. Phasellus nec elit ligula. Ut tempus urna ut lectus ullamcorper imperdiet. Quisque vitae massa sem, sed cursus sapien. Ut mi lorem... read more >

I prefer:

Lorem ipsum - 14 Jan 2011
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce porta diam in quam consectetur elementum. Vestibulum iaculis pellentesque mauris, non sodales erat egestas nec. Proin sed elit sed ligula ullamcorper adipiscing. Quisque pellentesque sapien odio. Phasellus nec elit ligula. Ut tempus urna ut lectus ullamcorper imperdiet. Quisque vitae massa sem, sed cursus sapien. Ut mi lorem... read more >

How to do so ?

3
Contributors
2
Replies
3
Views
5 Years
Discussion Span
Last Post by rotten69
0

Either use <span></span> to hold your date (removing the <div>) or change the divs to use display: inline-block. Either one will make the two display side by side.
Divs are block elements by default which means they don't lie side by side unless you style them to do so.

0

Well, why don't you put the text "Lorem ipsum" and the date in one div. For example,

<div id="pdate">Lorem ipsum- 14 Jan 2011</div>

Shouldn't that fix the problem?

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.