Grow your CSS skills. Land your dream job.

what is the best way to do this?

  • # June 1, 2008 at 8:10 pm

    I am trying to create a new page without using tables. If you go to http://www.photobyiris.com/portfolio.html . you can see what i want to do.

    I just want to re create the page in the middle with the red square and the six images with the text next to them. I have been able to get 3 images into a line by using the <ul> tag. but then when i add the text, everything goes bad. I got one image and text in using float:left on the image and the text, but when i went for number 2. again, everything went bad.

    Any advice?

    thanks

    # June 2, 2008 at 1:14 pm

    I think a list will work fine for this. You could define a unique list item class for each image.

    ul.list1, ul.list2 {
    margin: … ;
    padding: … ;
    list-style: none;
    }
    ul.list1 li, ul.list2 li { font, padding, margin properties here }
    ul.list1 li.image1 {
    background: url(images/image1.gif) no-repeat 0 30%;
    }
    ul.list1 li.image2 {
    background: url(images/image2.gif) no-repeat 0 30%;
    }
    etc. …

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".