SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Enthusiast
    Join Date
    Sep 2005
    Posts
    87
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Problem with older version of IE

    Hi,

    Please have a look over here:
    http://mocha-music.com/
    it looks good on IE8 but terrible on IE7
    What can I do to fix it?

    thanks!

  2. #2
    SitePoint Enthusiast 3dy.ro's Avatar
    Join Date
    Feb 2011
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Add an IE7-only stylesheet and try to override your default CSS.

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,352
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by 3dy.ro View Post
    Add an IE7-only stylesheet and try to override your default CSS.
    That's not exactly helpful and looks almost like fluff so please make sure your posts are constructive and provide proper solutions.

    The problem with the page is in fact down to a few typos in the CSS and there is no need to re-write all the css or include another stylesheet.

    There are three stray quotations marks that are corrupting the css and I have wrapped comments around them so that you can see where they are. You also need a position:relative and a margin as shown.

    Code:
    #header {
        background-image: url('http://mocha-music.com/wp-content/themes/oren/images/header.jpg');
        background-repeat: no-repeat;
        /* "*/
      /*min-height: 118px; no needed*/
        height:118px;
    }
    #middle {
        background-image: url('http://mocha-music.com/wp-content/themes/oren/images/middle.jpg');
        background-repeat: no-repeat;
    /*"*/
    /*    min-height: 216px;not needed*/
        height:216px;
        width:850px;
        direction: rtl;
        position:relative;
        margin-bottom:10px;
    }
    #bottom {
        background-image: url('http://mocha-music.com/wp-content/themes/oren/images/bottom.jpg');
        background-repeat: no-repeat;
        /*"*/
      /*min-height: 495; not needed and where's the units*/
        height:495px;
        width:850px;
        margin-top: -22px;
    }
    That will fix the page as I have copied and tested locally.

    Note that there is no need to say height and min-height with the same measurement and unit at the same time. Just use height if you want a fixed height or use min-height if you want min-height.

  4. #4
    SitePoint Enthusiast
    Join Date
    Sep 2005
    Posts
    87
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thank you very much!
    it works.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •