Simple CSS Image Gallery Problem

Discussion in 'Web Design and Development' started by corywoolf, Sep 9, 2009.

Most Liked Posts
  1. corywoolf, Sep 9, 2009

    corywoolf macrumors 65816

    corywoolf

    Joined:
    Jun 28, 2004
    #1
    Hello,

    I am putting some finishing touches on a website I built with RapidWeaver and was wondering how to modify the CSS to make 2 rows of 5 images in the photo gallery instead of the current rows of 3 images. I tinkered with the CSS for about an hour tonight and kept getting strange results. I know it has to do with "Float" and "Clear", but I am having trouble figuring out how to do something that should be a simple fix. I have taken some basic XHTML and CSS coding courses, but that was 4 years ago...

    Anyone with some web development experience, could you please take a look and give some hints/tips on how to achieve this?

    https://allstatemichiganquote.com/page10/page10.html

    Thanks in advance,

    - Cory

    Attached is the style sheet and html pages.
     

    Attached Files:

    share
    + Quote Reply
  2. nuxx, Sep 9, 2009

    nuxx macrumors member

    nuxx

    Joined:
    Jun 5, 2007
    Location:
    Tokyo
    #2
    Well, you've got a lot of CSS there but at a cursory glance I would suggest taking a look at the file 800.css where the declaration;

    Code:
    #content { width: 550px; }
    is limiting the content area to a width of 550px.

    Try changing it to

    Code:
    #content { width: 100%; }
    so it expands to fit the width of the parent element and allows 2 rows of 5 images.
     
    share
    + Quote Reply
  3. corywoolf, Sep 12, 2009

    corywoolf thread starter macrumors 65816

    corywoolf

    Joined:
    Jun 28, 2004
    #3
    Thanks a ton!
     
    share
    + Quote Reply
(You must log in or sign up to post here.)

Share This Page