I think you are overdoing the divs

And the id won't work. With id's you are only suppose to have 1 per page..
You need to you a class.

<div class="port_item">
<h2>Title</h2>
<img src="image_1.jpg">
<p>descriptive text</p>
</div>


.port_item{...}
.port_item h2{...}
.port_item img{...}
.port_item p{...}





On 11/17/10 1:24 PM, "John" <j...@coffeeonmars.com> wrote:

>Hello;
>
>My goal is to have a container div with a title at the top, an image
>at the left, inside the container, and text describing the image at
>the right, inside the container.
>
>then, I want to "rinse and repeat" for as many images as I have,
>adding the new ones to the top as they come in. My reasoning is that
>I like this arrangement for my portfolio site, and I want it to be
>easy to add new, recent work by merely duplicating the arrangement's
>code, and plugging in the new images' names and new descriptive text.
>
>I am experimenting with something like the code below, and it works
>fine in Firefox, but I wonder if it's the best way to code it.
>
>thanks for any feedback or pointers
>
>John
>
>here's the repeated arrangement, simplified:
>
><div id="outer">
><div id="title">Title</div>
><div id="image"><img src="image_1.jpg"></div>
><div id="descrip">descriptive text</div>
></div>
>
>
><div id="outer">
><div id="title">Title</div>
><div id="image"><img src="image_2.jpg"></div>
><div id="descrip">descriptive text</div>
></div>
>
>...etc...
>
>here are the actual divs and their statements:
>
>div#outer {
>    position: relative;
>    width: 750px;
>    height: 500px;
>    margin: 0px auto;
>    background-color: #b4a482;
>}
>
>div#title {
>    position: absolute;
>    top: 0;
>    left: 0;
>    width: 743px;
>    height: 5px;
>    padding: 0 0 0 7px;
>}
>
>  div#image {
>    position: absolute;
>    top: 80px;
>    left: 40px;
>    width: 330px;
>    padding: 0px;
>}
>
>div#descrip {
>    position: absolute;
>    top: 80px;
>    left: 420px;
>    width: 265px;
>    padding: 0px;
>}
>
>______________________________________________________________________
>css-discuss [cs...@lists.css-discuss.org]
>http://www.css-discuss.org/mailman/listinfo/css-d
>List wiki/FAQ -- http://css-discuss.incutio.com/
>List policies -- http://css-discuss.org/policies.html
>Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to