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 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Feb 2007
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Unhappy Css Image Won't Display In Firefox

    Hi There,

    I wondered if anyone can help?

    A CSS Banner Image won't display in Firefox on a PC (it seems fine on firefox on a mac & on all other browsers). I'd be grateful if there's anyone that can offer some advice, it would be hugely appreciated.

    Link:
    http://www.urbancomms.com/home.html

    See: #wrapper2

    Code:
    body {
    font: 62.5%/1.6em "Lucida Grande", "Lucida Sans Unicode", verdana, geneva, sans-serif;
    color:#888;
    margin:0;
    background:url(../images/body.jpg) top repeat-x #121212;
    background-attachment:fixed;
    }

    * {
    margin:0;
    padding:0;
    }

    #wrapper1 {
    background:#FFFFFF;
    padding:0 0px 0px 0px;
    width:760px;
    margin:0 auto;
    }

    #wrapper2 {
    width:740px;
    background: url("../images/common/wrapper2.jpg") bottom repeat-x #fff;
    border-left:1px solid #999999;
    border-right:1px solid #999999;
    border-bottom:1px solid #999999;
    padding:0 10px 10px 10px;
    }

    #nav {
    float:rleft;
    border:none;
    padding:0;
    margin:0;
    }

    #nav li {
    float:left;
    list-style:none;
    margin:0 4px 0 0;
    padding:0;
    }

    #nav li a {
    display:block;
    padding:130px 5px 9px 10px;
    background:#fff;
    color:#444;
    text-decoration:none;
    text-transform:uppercase;
    margin:0 1px 0 0;


    }
    #nav li a:hover {
    background: url("../images/common/nav_a_hover3.jpg") top center no-repeat #fff;
    color:#B68066;

    }

    #header h1 {
    float:right;
    padding:50px 20px 34px 120px;
    background: url("../images/common/uc_logo.gif") left bottom no-repeat;
    }
    #header h1 a {
    color:#000000;
    text-decoration:none;
    border:none;
    }
    #header h1 a:hover {
    color:#000;
    }
    #header h1 span {
    font-size:.5em;
    color:#ccc;
    text-transform:uppercase;
    }

    #container {
    clear:both;
    padding:20px 0 0 0;
    }

    p.description {
    background: url("../images/banners/description1.jpg") left bottom no-repeat #FFFFFF;
    padding:120px 30px 40px 10px;
    color:#FFFFFF;
    }

    p.description a {
    color:#fff;
    text-decoration:none;
    font-weight:bold;
    border-bottom:1px dotted #8CD1FF;
    }
    p.description a:hover {
    border-bottom:1px solid #8CD1FF;
    }

    #sidebar {
    width:230px;
    float:right;
    padding:0px 20px 10px 10px;
    margin:0 0 0 0;
    }

    #content {
    margin:0 260px 0 5px;
    padding:10px 20px 0 0;
    background: url("../images/common/content.jpg") top right no-repeat;
    }

    #content h2 {
    font:2.0em Arial;
    color:#B68066;
    letter-spacing:-1px;
    margin:10px 0;
    border-bottom:2px solid #eee;
    background: url("../images/common/h2.jpg") bottom left no-repeat;
    clear:left;
    }
    #content h2 a {
    color:#B68066;
    text-decoration:none;
    }
    #content p {
    margin:15px 0;
    font-size:110%;
    line-height:21px;
    }
    ol.subnav {
    margin:-10px 0 0 -5px;
    padding:0;
    }
    ol.subnav li {
    float:left;
    list-style:none;
    margin:0;
    padding:0;
    }
    ol.subnav a {
    font-weight:bold;
    color:#555;
    border-top:2px solid #fff;
    display:block;
    padding:5px;
    text-decoration:none;
    margin:0 5px 0 0;
    border-bottom:none;
    }
    ol.subnav a:hover {
    border-top:2px solid #005A97;
    color:#121212;
    border-bottom:none;
    }

    #sidebar h2 {
    color:#333;
    margin:10px 0;
    font-size:1.3em;
    }

    p.news {
    background:#f4f4f4;
    padding:10px;
    margin:0 0 10px 0;
    border-left:5px solid #f0f0f0;
    }

    p.news a.more {
    display:block;
    color:#333;
    text-decoration:none;
    text-align:right;
    border:none;
    }

    #sidebar ul {
    list-style:none;
    border-top:1px solid #eee;
    border:none;
    padding:0;
    margin:0;
    }
    #sidebar ul li {
    border-bottom:1px solid #eee;
    padding:5px;
    margin:0;
    }
    #sidebar ul li a {
    color:#0066dd;
    text-decoration:none;
    }
    #sidebar ul li a:hover {
    color:#0033aa;
    }

    input {
    padding:5px;
    border:1px solid #eee;
    color:#555;
    width:220px;
    }

    #content h3 {
    font:1.8em Trebuchet MS;
    color:#555;
    margin:10px 0;
    }
    blockquote {
    padding:0 0 0 10px;
    border-left:5px solid #eee;
    }

    ul {
    margin:10px 10px 10px 0;
    padding:0 0 0 15px;
    border:1px solid #eee;
    }
    li {
    margin:0 0 0 10px;
    padding:5px;
    }
    #content img {
    paddingx;
    border:0px solid #eee;
    }
    a {
    color:#222;
    border-bottom:1px dotted #ccc;
    text-decoration:none;
    }
    a:hover {
    border-bottom:1px solid #ccc;
    }
    #footer {
    font:9px Trebuchet MS, Arial, Helvetica, sans-serif;
    text-align:center;
    border-top:0px solid #FFFFFF;
    padding:10px;
    margin:30px 0 0 0;
    color:#ACACAC;
    width:760px;
    margin:0 auto;
    }
    #footer a {
    color:#666666;
    }

    #monthformat {
    border-bottom: 1px dashed #B68066;
    }

    #dateformat {
    font:11px Arial, Helvetica, sans-serif;
    font-weight:bold;
    color: #B68066;
    }

    #dateformat a {
    font:11px Arial, Helvetica, sans-serif;
    color: #B68066;
    font-weight:bold;
    text-decoration:none;
    }

    #dateformat a:hover {
    color: #B68066;
    }

    .copyblock { text-align:right; margin-top:20px;font: 62.5%/1.6em "Lucida Grande";color: #666;text-decoration: none }

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,667
    Thanks
    22
    Thanked 1,826 Times in 1,810 Posts
    Hello SarahB,
    common/wrapper2.jpg is displaying fine here. I looked at it with IE7 and FF2 on a Vista machine.
    Check your site with the validator.
    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
    Feb 2007
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanx alot for having a look for me, it's appreciated.

    I haven't used validation before. I tested the css file and it caused certain elements to come out of position.

    Any tips on how's best to re-write the code so that it works in FF? This is all fairly new to me :-)


  •  

    Posting Permissions

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