Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Im Stumped – Float problem in Firefox

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #24794
    StuartThom
    Member

    Hi Folks,

    First time writing into a forum for a CSS fix. I have a relatively small display issue that is killing me!

    Working on a page: http://paohorticultural.publishpath.com/projectgallery
    styles: http://paohorticultural.publishpath.com … layout.css

    Beneath the slide show there is a row I have called: #photorow that contains 3 buttons contained in an unordered list.

    For some reason it displays exactly as intended in Safari and IE7…(each button sits beside each other flush within 930px space) but Firefox is adding about 15 pixels of space on the right side of each <li>. Often the 3rd button is pushed to another row.

    Ive broken out the Firefox, IE toolkits and the Safari Development toolkit and I cant seem to find where the issue is coming form.

    I am using Speaklight CMS to host the pages… they have a CSS file of their own..:Water.css but I dont see a reason it would be overriding any of the styles.

    I have a feel either I have forgotten to add something to the markup language or have somehow screwed the styles I have added for this section.

    Anyone have any ideas? Any help would be truly appreciated!

    #57162
    apostrophe
    Participant

    Add a width declaration to your list items. That’s the 300px width of your bg images plus the 5px padding = 305px

    Code:
    #photorow li {
    float:left;
    margin:0;
    padding:0;
    vertical-align:top;
    width:305px;
    }
    #57163
    StuartThom
    Member

    Thanks apostrophe! I knew I forgot something small!
    I owe you one!

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.