Broken Elastic layout in IE8

Discussion in 'CSS' started by iluvm, Jan 19, 2010.

  1. #1
    Hello,

    I did this site a few years ago for friends, they initially wanted a fixed layout, then changed their minds (after the site was finished) and wanted an elastic layout.

    I modded with CSS and added container and wrapper to make site elastic. All seemed to work fine in IE 6.5 & 7 but elastic layout never worked in firefox.

    Now in IE 8 the elastic layout doe's not work at all.

    I'm fed up of looking at it, can some one let me know whats wrong.

    I've attached css file

    site - lynflora co uk

    Thanks
     

    Attached Files:

    • css.txt
      File size:
      3.4 KB
      Views:
      144
    iluvm, Jan 19, 2010 IP
  2. hartwm

    hartwm Member

    Messages:
    141
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    30
    #2
    cant tell you without seeing it live...but get rid of @charset "utf-8";
    use *{} to clear margins, padding for crossbrowser compatibility, it may help
     
    hartwm, Jan 19, 2010 IP
  3. unigogo

    unigogo Peon

    Messages:
    286
    Likes Received:
    8
    Best Answers:
    0
    Trophy Points:
    0
    #3
    I looked at the CSS even though without HTML code. I wonder how these code works in IE 6.5 & 7. The units of measurement are all px. That means the layout will be fixed layout.

    The unit for elastic or liquid layout should be %. The unit for liquid - fixed layout will be wrapper - %, columns - px.

    You can test in the various layout generators under signed.
     
    unigogo, Jan 21, 2010 IP
  4. hartwm

    hartwm Member

    Messages:
    141
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    30
    #4
    well it looks like he is making it "elastic" using absolute positioning to move things to the left and right of browser window...but the main content in the middle i do agree should be em's so that there arent large gaps, don't use % whenever possible, because that crappy browser microsoft makes doesnt render it well, i guess they dont know math at microsoft
     
    hartwm, Jan 21, 2010 IP
  5. iluvm

    iluvm Peon

    Messages:
    165
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Hello,

    Thanks for the advice but to be totally honest I'm not following / understanding it.

    What I wanted was the main content of the site to be centered no matter what screen resolution was used. The site was centered in IE 6.5 & 7 but not in firefox.

    Since IE 8 was introduced, site is fixed to the left.

    What I thought I had /wanted is absolute positioned div's within an elastic container.

    Are you's saying I should convert all the px absolute positions to relative em positions?

    Any help would be appreciated.
     
    Last edited: Jan 21, 2010
    iluvm, Jan 21, 2010 IP
  6. iluvm

    iluvm Peon

    Messages:
    165
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Hello,

    I've attached a notepad of the html of the page.
     

    Attached Files:

    iluvm, Jan 21, 2010 IP
  7. hartwm

    hartwm Member

    Messages:
    141
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    30
    #7
    i will only work on a live site...so zip the html with css and js linked and in a folder and i will help
     
    hartwm, Jan 21, 2010 IP
  8. iluvm

    iluvm Peon

    Messages:
    165
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #8
    Hello,

    I've attached zip file with html,css & script file in

    Thanks in advance for any help
     

    Attached Files:

    iluvm, Jan 21, 2010 IP