Announcement

Collapse
No announcement yet.

Display Problem - CSS issue?

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Display Problem - CSS issue?

    Am hoping someone can help me out with this. It's been pointed out to me that the site isn't displaying correctly in IE7. It's also not quite right in Safari but fine in IE6/Firefox.

    Can anyone advise please?

    Thanks in advance!

    Edit sorry, might help if I posted the address

    www.thepolicestore.co.uk
    Attached Files

    #2
    Can you point out particular areas that are causing concern


    Bikster
    SellerDeck Designs and Responsive Themes

    Comment


      #3
      Yes, the site logo is all messed up with the nav bar etc.

      Ignore the green t-shirt on the left, that was the bestseller list enabled.

      Comment


        #4
        In Safari, the grey bar that runs the length of the window behind the nav bar is at the top of the screen, not the end of the world TBH but the IE7 thing is.

        Comment


          #5
          Difficult to check exactly on the fly but look at

          .page_header_content {
          width: 762px;
          text-align: left;
          height: 63px;
          }

          and change to......

          page_header_content {
          width: 762px;
          text-align: left;
          height: 280px;
          clear: both;
          }

          this moved the grey bar down to span the full width behind the nav bar.

          The problem in IE7 are the various <div's> are collapsing ... you need to add some clear: both; and set specific height to them to force them to flow correctly.

          ... there is a lot of stuff going on in there and with the CSS being compacted does not make for an easy read... not sure if what is there is the best way to go about things but hopefully the above may be a starter for 10 when applied to the other elements in the header.

          I would take a step back and think about the logical construction of the header area.


          Bikster
          SellerDeck Designs and Responsive Themes

          Comment


            #6
            jont, sorry but change it where?

            Comment


              #7
              Sorry .. thats coming from the stylesheet ... in design tab mode click on the page type drop down and select "stylesheet".

              May be worth copying the existing (or making a note) before editing... you can copy and past the existing and wrape between comment tags eg:

              /*
              .page_header_content {
              width: 762px;
              text-align: left;
              height: 63px;
              }
              */

              and that will prevent the browser from showing on the screen ... to re-sue simply remove the /* comment tags */


              Bikster
              SellerDeck Designs and Responsive Themes

              Comment


                #8
                jont, just want to say thanks, that appears to have worked

                Sorry for the delay, been away!

                Comment

                Working...
                X