Login | Register | FAQ
Anonymous

aligning text within <div>

+ Post a reply

4 posts Page 1 of 1


aligning text within <div>

by wilsonsj1025 » Sun Feb 13, 2011 1:01 am

I would like help in getting my line items stretched across the <div> box. I want 3 bullets on the left, 3 bullets in the middle, and 3 bullets on the right. This is my code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD

HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>

<style type="text/css">
#bulletdiv {
height:5%;
width:100%;
background:red;
text-align:justify;
border: 1px solid blue;
}
</style>

</head>

<body>

<div id="bulletdiv">
<ul>
<li>Residential and Commercial Painting</li>
<li>Interior and Exterior Painting</li>
<li>Walls and Trim Repair</li>
<li>Cabinet Restoration</li>
<li>Deck Restoration and Repair</li>
<li>Dock Restoration and Repair</li>
<li>blah</li>
<li>blah</li>
<li>blah</li>
</ul>
</div>

</body>

</html>

Any help would be appreciated!

Thank you!
User avatar

wilsonsj1025

  • Posts: 2
  • Joined: Sun Feb 13, 2011 12:53 am

Re: aligning text within <div>

by HTML.net » Sun Feb 13, 2011 11:38 am

You can use the column example from lesson 13 in the CSS tutorial:

CSS:

#column1 {
float:left;
width: 33%;
}

#column2 {
float:left;
width: 33%;
}

#column3 {
float:left;
width: 33%;
}


HTML:

<div id="column1">
<ul>
<li>Residential and Commercial Painting</li>
<li>Interior and Exterior Painting</li>
<li>Walls and Trim Repair</li>
</ul>
</div>

<div id="column2">
<ul>
<li>Cabinet Restoration</li>
<li>Deck Restoration and Repair</li>
<li>Dock Restoration and Repair</li>
</ul>
</div>

<div id="column3">
<ul>
<li>blah</li>
<li>blah</li>
<li>blah</li>
</ul>
</div>


- Andreas, HTML.net
User avatar

HTML.net
Site Admin

  • Posts: 1194
  • Joined: Sat Sep 11, 2010 11:24 am
--
Show some love for HTML.net on Twitter, Facebook and Google: Use the buttons on top of all pages.

Re: aligning text within <div>

by wilsonsj1025 » Sun Feb 13, 2011 3:06 pm

Awesome! Thank you! :)
User avatar

wilsonsj1025

  • Posts: 2
  • Joined: Sun Feb 13, 2011 12:53 am

Re: aligning text within <div>

by Robster79 » Sun Feb 27, 2011 11:42 pm

Very helpful question with a very helpful answer. This clarified some things for me. Thanks.
User avatar

Robster79

  • Posts: 1
  • Joined: Sun Feb 27, 2011 11:33 pm


+ Post a reply

Page 1 of 1