Announcement

Collapse
No announcement yet.

IE layout

Collapse
X
Collapse
 
  • Page of 1
  • Filter
  • Time
  • Show
Clear All
new posts
Previous template Next
    #1

    IE layout

    can anyone offer suggestions why the width of the layout goes astray in IE but is Ok in FF

    http://www.surf-wax.co.uk/acatalog/index.html

    outertable is 860 px, banner/logo is also 860px

    also what about the go button on the quick search? again fine in FF, nice red button, button goes blue in IE
    Tags: None
    #2
    Jo,

    Not sure about the overall width problem - need more time to look at the source.

    The go button problem looks like IE's hopeless support for PNG alpha transparency.

    There's a good article here:

    http://www.alistapart.com/articles/pngopacity/

    about working around it. I tend to use gifs instead, despite png being a much better format.

    HTH
    Chris
    -----
    http://www.livingaidsonline.co.uk

    Comment

      #3
      Jo

      I could be wrong but shouldn't the link to the external style sheet be placed in the <head> of your page. You have a duplicate in the body:

      <!-- SIMPLESEARCH HTML BEGIN -->
      <link href="actinic.css" rel="stylesheet" type="text/css">

      Hope that helps.

      Anthony
      Anthony Deeming

      Green Jersey Web Design Ltd
      www.greenjersey.com

      Comment

        #4
        Jo - don't forget about the IE box model being different to that of FF - it treats both margins and borders slightly different - best to set the outer wrapper to a default ZERO for both margins and padding and dropping everything inside the outer wrapper.

        Started to read through the CSS but there is a lot of duplicate content and multiple calls as pointed out by BilstonBob


        Bikster
        SellerDeck Designs and Responsive Themes

        Comment

          #5
          Unfortunatley I haven't yet managed to get my head around tableless design , hence the mismash of table definitions.

          I'll tidy up the tables to see if this helps.

          Multiple css defs are there to aid design in DW. If you want to see the effects of design changes with Css in place you have to add the CSS def to thetemplate. Sometimes I forget to remove it

          Comment

            #6
            Originally posted by pinbrook
            Sometimes I forget to remove it
            Your not the only one guilty of that


            Bikster
            SellerDeck Designs and Responsive Themes

            Comment

              #7
              Quirks Mode

              Hi Jo,

              The layout could be astray because the site is tripping quirks mode on - in Firefox quirks mode still (I think) renders the box model correctly, while IE renders incorrectly. Not sure what's tripping the quirks though - could be your doctype declaration - should be (for transitional):
              <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
              You don't seem to have the url reference - it isn't necessary for the strict and frameset but AFAIK is for the transitional.

              I would second what Jont said - include an html and body declaration of margins, padding and border 0 and then override them where necessary - IE has a nasty habit of applying a default set that gets inherited.

              I find the Web Developer extension to Firefox invaluable - for starters you can see when quirks mode is on because it has a little tick - blue when standards mode, greyed out on quirks. Also helps with CSS, Tables, Divs and Spans, etc...

              Hope it helps
              Andy R

              Comment

              Previous template Next
              Working...
              X