Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New to the CF scene
    Join Date
    Oct 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Site display in different browsers

    Hi there,

    I'm new here, just signed up as you seem like a knowlegable bunch of people so hopefully will be able to help qith my queries. I own a personalised number plate website and have been having some trouble with the way it is displaying in different browsers. It looks fine on my laptop using the latest version of IE, and also looks fine in Safari, but when I have viewed the site at work (still using IE6), there are some display problems.

    The site is located at...

    www.plate-trader.com

    The problems are...

    1) The header above the navigation bar (i.e where the logo and phone number is) is larger than it should be on all of my pages

    2) My adsense adverts are displayed above and below my numberplate image headers (on the Buy, Sell, Wanted etc. pages) rather than either side

    3) When I click More Info on any particular number plate, the top of the number plate text on the More Info page, is cut off

    4) The site text is all displayed in Times New Roman, which looks really old fashioned, as a pose to Arial

    As I said, these problems are only when viewing the site at work on IE6, they look fine here, I have not tested other browsers so I'm not sure on those. I think it could be something to do with the stylesheet or something but I am a complete n00b when it comes to html etc. (someone made the site for me) so I'm not sure.

    If any of you guys could help me with it or shed any light, that would be brilliant.

    Thanks,
    Karl
    Last edited by oracleguy; 10-28-2009 at 07:57 PM. Reason: Fixed/Changed link

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,666
    Thanks
    22
    Thanked 1,826 Times in 1,810 Posts
    Hello m0ssy,
    A good place to start would be to work on getting your page to validate. After that, if any of those issues are still present, you could address them then.

    See the links about valdating in my sig below.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #3
    New to the CF scene
    Join Date
    Oct 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Ok thanks for that but as I said I'm a total n00b when it comes to coding etc. Can anyone put into laymans terms exactly what I would need to do to fix these issues?

    Thanks

  • #4
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,666
    Thanks
    22
    Thanked 1,826 Times in 1,810 Posts
    Did you run your site through the validator? -http://diveintomark.org/archives/2003/05/05/why_we_wont_help_you

    Your header is the size of the image you've made for it. If you want it to be smaller, it looks like you'll need a new image...
    you could try changing these bits in red though
    Code:
    ../snip
    second {padding: 0 0 0.6em 0; text-align:left;}
    p.third {padding: 0 0 0em 0; text-align:left;}
    li {color:#000000;}
    
    /*Main Container whereby all content is placed here*/
    #container {width:880px; margin:0px auto; padding:2px 0; text-align:left; background:#f3efef; color:#e3e3e2; border:1px solid #0c0c0c}
    #header {
    height:55px; 
    width:876px; 
    background:#e3e3e2 url(img/header5.jpg); 
    margin:0 2px 1px 2px;
    }
    /* Navigation Goes Here */
    #navlist
    {
    border-bottom: 1px solid #FFCC66;
    border-top: 1px sol
    /..
    ../snip
    #content ul,#content ol {margin:0 5px 16px 35px;}
    #content dl {margin:0 5px 10px 25px;}
    #content dt {font-weight:bold; margin-bottom:5px;}
    #content dd {margin:0 0 10px 15px;}
    
    
    /* Sidebar styles */
    #subcontent {
    float:right; 
    width:90px; 
    padding:10px 5px 10px 0; 
    line-height:1.0em;
    background: #f00; /*for demonstration only*/
    }
    #subcontent h2 {display:block; margin:0 0 15px 0; font-size:1.6em; font-weight:normal; text-align:left; letter-spacing:-1px; color:#505050; background-color:inherit;}
    #subcontent p {margin:0 0 6px 0; font-size:0.9em;}
    
    /* Sidebar styles */
    #subcontentL {
    float:left; 
    width:240px; 
    height:20px; 
    padding:20px 0px 0px 1px; 
    line-height:1.1em; 
    letter-spacing:-1px; 
    font-size:0.9em; 
    color:#edb200;
    background: #00f;/*for demonstration only*/
    }
    #subcontentL a {color:#FFFFFF; text-decoration: none;}
    
    /* Menublock styles */
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #5
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,666
    Thanks
    22
    Thanked 1,826 Times in 1,810 Posts
    Quote Originally Posted by m0ssy View Post
    2) My adsense adverts are displayed above and below my numberplate image headers (on the Buy, Sell, Wanted etc. pages) rather than either side
    In your markup, you've told everything insideof .contentFull to be centered. The <center> tag is depricated and is one of the things the validator finds for you.

    delete this bit highlighted in red -
    Code:
    	
    <div id="content">
    <div class="contentFull">
    <center><p>
    <script type="text/javascript"><!--
    google_ad_client = "pub-3955244521434408";
    /* 234x60, created 19/10/09 */
    google_ad_slot = "6852599267";
    google_ad_width = 234;
    google_ad_height = 60;
    //-->
    </script>
    <script type="text/javascript"
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #6
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,666
    Thanks
    22
    Thanked 1,826 Times in 1,810 Posts
    Quote Originally Posted by m0ssy View Post
    3) When I click More Info on any particular number plate, the top of the number plate text on the More Info page, is cut off
    This is a pretty small page with a LOT of errors. See http://validator.w3.org/check?verbos...FprefixID%3D51

    Not sure if it's the line-height, the open <tr>, or which other error...
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #7
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,666
    Thanks
    22
    Thanked 1,826 Times in 1,810 Posts
    Quote Originally Posted by m0ssy View Post

    4) The site text is all displayed in Times New Roman, which looks really old fashioned, as a pose to Arial
    To change your font, change your css styling for body to this -
    Code:
     
    body {
    font: 1em/1.4em Arial; 
    text-align:center; 
    color:#000000; 
    background:#000000 url(img/bg.gif) repeat fixed 0 0;
    }
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad


  •  

    Posting Permissions

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