Forums

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

Home › Forums › CSS › CSS

    Horizontal list not working in IE7

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • May 11, 2013 at 9:02 pm #44718
    owenmathers
    Member

    Hi all,
    I am troubleshooting a site which uses a horizontal list for a menu:
    http://www.beautifulillusions.co.uk/2013/index.htm

    It all works fine on Safari/Chrome and IE8+ but I can’t get to work horizontally on IE7… I have tried various fixes and other css tricks to make it work but no joy… it currently displays as a range right vertical menu on IE7.

    HTML as follows:

    CSS as follows:

    #menu{
    margin: 37px 10px 10px 0px;
    list-style: none;
    clear: none;
    text-align: right;
    padding: 0;
    display:inline;
    }
    #menu li{
    font-family: Josefinsans, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: normal;
    text-transform: uppercase;
    line-height:100%;
    list-style:none;
    display:inline;
    white-space: nowrap;
    float:left;
    margin:0;
    }

    * html #menu li{
    display: inline;
    }
    * + html #menu li{ display:inline; width:650px;
    } /* for IE 7 */

    #menu li a{
    color:#FFFFFF;
    text-decoration: none;
    padding: 12px 0px 0px 15px;
    float:right;
    }
    #menu li a:hover{
    color:#DED4E9;
    }

    Any help greatly appreciated – as am very stuck, Thanks

    May 13, 2013 at 5:32 am #134901
    Paulie_D
    Member

    display:inline;
    float:left

    One or the other…not both.

    You might try:

    zoom:1

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