positioning text/image with a border
- by user167487
Learning html/css, having trouble with positioning text and or images within a border on a page exactly where i want them. I'm first trying to stack them underneath each other vertically, but i dont know how to move each box underneath, at the moment they are stacking horizontally until they go over the max width, what do i do?
HTML:
<div id="column1">
<p>blah blah blah</p>
</div>
<div id="column2">
<p>blah blah blah</p>
</div>
<div id="column3">
<p>blah blah blah</p>
</div>
CSS:
p {
font-family: Tahoma;
font-size: 14px;
margin: 1px;
padding: 10px;
text-align: left;
background-color: white;
width: 800px;
}
#column1 {float: left; position: relative; width: 200px; padding: 3px; background: gray ; top: 10px;margin: 1px; }
#column2 {float: left; position: relative; width: 200px; padding: 3px; background: orange; top:50px;margin: 1px; }
#column3 {float: left; position: relative; width: 200px; padding: 3px; background: gray; top: 100px;margin: 1px; }