Some text on my site is cut off in Internet Explorer

Discussion in 'HTML & Website Design' started by pentester101, Apr 16, 2009.

0
  1. #1
    Hello,

    I have a website http://www.pcnwork.com/ and when you go to it in Internet Explorer the text on the left is cut off. This happens on every page and I cannot figure it out. When you view the site in Firefox it looks fine. The problem only occurs in internet explorer.

    I think it might be a css issue but I am not sure.

    Any help would be most appreciated.

    Thanks!
     
    pentester101, Apr 16, 2009 IP
  2. mr_banks

    mr_banks Peon

    Messages:
    11
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    here is what you have to do to fix that. first find this line of code in the CSS.

    #wrapper{
    width: 770px;
    margin-left: 25%;
    margin-right: 255;
    }

    and change it to this.

    #wrapper{
    width: 770px;
    margin:0 auto;
    }

    This is the proper way to center an element with css. Now your content will be in the center no matter what the screen resolution is. Before this will work you have to make one more change.

    this is the line of code that was causing the problem. find this line

    #content {
    width: 880px;
    margin-left: -48px;
    padding-left: 0px;
    }

    and change it to this

    #content {
    width: 880px;
    margin-left: 48px;
    padding-left: 0px;
    }

    It does not center itself in IE so you should put in a conditional statement and give #wrapper some left padding and you can get the desired effect. I gave it a padding of 25% and it was centered on my screen. I have 1024 resolution. If you have any trouble with this let me know and we can get it taken care of.
     
    mr_banks, Apr 16, 2009 IP
  3. pentester101

    pentester101 Peon

    Messages:
    54
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    I tried finding those elements in the css code but I could not. I can PM you my css script if you would be willing to take a look at it.
     
    pentester101, Apr 16, 2009 IP
  4. drhowarddrfine

    drhowarddrfine Peon

    Messages:
    5,428
    Likes Received:
    95
    Best Answers:
    7
    Trophy Points:
    0
    #4
    You will never get IE to attempt to act like other more modern browsers, such as Firefox, without a proper doctype. Add this to the first line:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">

    Then see what happens.
     
    drhowarddrfine, Apr 16, 2009 IP
  5. pentester101

    pentester101 Peon

    Messages:
    54
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    This worked! Thanks! I also used:

    <!--[if IE]>
    <style>
    #wrapper {
    padding-left:25%;
    }
    </style>
    <![endif]-->

    which worked too, props to mr_banks who gave me the afore mentioned code.


    Both methods worked but I think that the <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd"> is probably the better method to use.


    Thanks!
     
    pentester101, Apr 16, 2009 IP
  6. drhowarddrfine

    drhowarddrfine Peon

    Messages:
    5,428
    Likes Received:
    95
    Best Answers:
    7
    Trophy Points:
    0
    #6
    All new web pages are required to use that current doctype. There are no exceptions.
     
    drhowarddrfine, Apr 17, 2009 IP