SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Member
    Join Date
    Jan 2008
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Wierd Firefox Results

    Hi i have created a site and my first time using css and i get a wierd result in FF that i dont get in IE..



    In IE you will see there is no gap between the navbar and in FF there is could someone please help thanks..
    Heres my css file.

    Code CSS:
    /*  
     
    Theme Name: Elvis and Laura
     
     
    Description: The layout built from scratch for Elvis by William
     
    Version: 1.6
     
    Author: William
     
     
     
    */
     
    body{
     
    margin-left: auto;
     
    margin-right: auto;
     
    margin: 0;
     
    padding:0;
     
    color: #333333;
     
    background-image: url(images/back.jpg);
     
    }   
     
    .navbar{
     
    position:relative;
     
    top:367px;
     
    margin-left: auto;
     
    margin-right: auto;
     
    width:735px;
     
    color: #1eb0ad;
     
    height: 32px;
     
    margin-left: auto;
     
    margin-right: auto;
     
    font-size: 11px;
     
    font-weight: bold;
     
    font-style: normal;
     
    font-family: Arial, Helvetica, sans-serif;
     
    text-align: center;
     
    }
     
    #c-block {
     
    position: relative
     
    width: 769px;
     
    z-index:1;
     
    color: #333333;
     
    height:80%;
     
    margin-left: auto;
     
    margin-right: auto;
     
    background-repeat: no-repeat;
     
    }
     
    #hdr{
     
    height:397px;
     
    background:#1d1d1d;
     
    color: #333333;
     
    width: 769px;
     
    background-image: url(images/header.jpg);
     
    margin-top: 0;
     
    margin-bottom: 0;
     
    margin-left: auto;
     
    margin-right: auto;
     
    border-top-width: 0;
     
    border-right-width: medium;
     
    border-bottom-width: 0;
     
    border-left-width: medium;
     
    border-top-style: solid;
     
    border-right-style: solid;
     
    border-bottom-style: solid;
     
    border-left-style: solid;
     
    border-top-color: #171717;
     
    border-right-color: #171717;
     
    border-bottom-color: #171717;
     
    border-left-color: #171717;
     
    }
     
    #c-col{
     
     
    position:relative;
     
    background:#000000;
     
    color: #333333;
     
    z-index:5;
     
    width: 769px;
     
    height: 800px;
     
    margin-bottom: 0;
     
    margin-left: auto;
     
    margin-right: auto;
     
     
    overflow: visible;
     
    border-top-width: 0;
     
    border-right-width: medium;
     
    border-bottom-width: 0;
     
    border-left-width: medium;
     
    border-top-style: solid;
     
    border-right-style: solid;
     
    border-bottom-style: solid;
     
    border-left-style: solid;
     
    border-top-color: #171717;
     
    border-right-color: #171717;
     
    border-bottom-color: #171717;
     
    border-left-color: #171717;
     
    }
     
    .ftrtable {
     
    width: 769px;
     
    color: #FFFFFF;
     
    font-size: 11px;
     
    font-weight: bold;
     
    font-family: Arial, Helvetica, sans-serif;
     
    font-style: normal;
     
    }
     
    .ftrtable tr th {
     
    color: #FFFFFF;
     
    font-style: normal;
     
    font-size: 12px;
     
    font-family: Arial, Helvetica, sans-serif;
     
    width: 33%;
     
    }
     
    #ftr a:link, #ftr a:visited, #ftr a:active {
     
    text-decoration: none
     
    }
     
    #ftr {
     
    background:#1d1d1d;
     
    color: #FFFFFF;
     
    width: 769px;
     
    margin-top: 0;
     
    margin-bottom: 0;
     
    margin-left: auto;
     
    margin-right: auto;
     
    z-index: auto;
     
    border-top-width: 0;
     
    border-right-width: medium;
     
    border-bottom-width: 0;
     
    border-left-width: medium;
     
    border-top-style: solid;
     
    border-right-style: solid;
     
    border-bottom-style: solid;
     
    border-left-style: solid;
     
    border-top-color: #171717;
     
    border-right-color: #171717;
     
    border-bottom-color: #171717;
     
    border-left-color: #171717;
     
    }
     
    .narrowcolumn {
     
    text-align: center;
     
    float: left;
     
    padding: 0 0 20px 45px;
     
    margin: 0px 0 0;
     
    width: 450px;
     
    line-height: 1.4em;
     
    }
     
    body a:link {
     
    color: #1eb0ad;
     
    }
     
    body a:hover {
     
    color: #FFFFFF;
     
    }
     
    .postdiv {
     
    position: absolute;
     
    font-family: Arial, Helvetica, sans-serif;
     
    font-size: 11px;
     
    font-style: normal;
     
    color: #FFFFFF;
     
    width: 390px;
     
    height: 154px;
     
    top:0px;
     
    left:110px;
     
    }
     
    .postspan {
     
    position: relative;
     
    background-color: #1D1D1D;
     
    border: thin solid #1D1D1D;
     
    font-family: Arial, Helvetica, sans-serif;
     
    font-size: 11px;
     
    font-weight: bold;
     
    color: #FFFFFF;
     
    width: 390px;
     
    }
     
    .postimage {
     
    border: thick solid #1D1D1D;
     
    }
     
    .leftcolumn {
     
    position: relative;
     
    top:5px;
     
    left:10px;
     
    float: left;
     
    width: 500px;
     
    height: 341px;
     
    }
     
    .contentdiv {
     
    position: relative;
     
    height: 150px;
     
    width: 500px;
     
    left: 5px;
     
    color: #FFFFFF;
     
    font-style: normal;
     
    font-size: 12px;
     
    font-family: Arial, Helvetica, sans-serif;
     
    }
     
    .sidebar {
     
    position: absolute;
     
    top:5px;
     
    left:500px;
     
    width: 252px; 
     
    height: 335px;
     
    }
     
    .searchsubmit
     
    {
     
    font-size: 11px;
     
    color: #FFFFFF;
     
    background: #111111;
     
    border: 2px solid #262626;
     
    padding-top:1px
     
    } 
     
    .searchinput
     
    {
     
    font-size: 11px;
     
    color: #FFFFFF;
     
    background: #111111;
     
    border: 2px solid #262626;
     
    } 
     
    .calendar_wrap {
     
    font-family: Arial, Helvetica, sans-serif;
     
    font-size: 11px;
     
    color:#FFFFFF;
     
    width: 230px;
     
    }
     
    .calender_header {
     
    color:#1eb0ad;
     
    text-align:left;
     
    }
     
    .widgettitle {
     
    background-color: #171717;
     
    color: #FFFFFF;
     
    font-style: normal;
     
    font-weight: bold;
     
    font-size: 12px;
     
    font-family: Arial, Helvetica, sans-serif;
     
    }
     
    li {
     
    color: #1eb0ad;
     
    list-style-type: square;
     
    font-size: 11px;
     
    font-weight: bold;
     
    font-family: Arial, Helvetica, sans-serif;
     
    font-style: normal;
     
    }
     
    li span {
     
    color:#FFFFFF;
     
    }
     
    a:visited {
     
    color: #1eb0ad;
     
    font-size: 11px;
     
    font-weight: bold;
     
    font-family: Arial, Helvetica, sans-serif;
     
    font-style: normal;
     
    }
     
    .alignleft {
     
    color: #1eb0ad;
     
    font-size: 11px;
     
    font-weight: bold;
     
    font-family: Arial, Helvetica, sans-serif;
     
    font-style: normal;
     
    text-align:left;
     
    }
     
    .alignright {
     
    color: #1eb0ad;
     
    font-size: 11px;
     
    font-weight: bold;
     
    font-family: Arial, Helvetica, sans-serif;
     
    font-style: normal;
     
    text-align:right;
     
    }
     
    .falbum-recent-thumbnail {
     
    border: thick solid #1D1D1D;
     
     
     
    }
     
    .title {
     
    text-align:center;
     
    color:#FFFFFF;
     
    font-family: Arial, Helvetica, sans-serif;
     
    font-weight: bold;;
     
    }
     
    .photoalbum{
    text-align: left;
    margin-top: 10px;
     
     
    }
     
    .photoalbum .header {
    color: #FFFFFF;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    }
     
    .photoalbum .status {
    color: #333333;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    }
     
    a img {
     
    border: none;
     
    }
     
    .postdivbottom {
     
    position: relative;
     
    top:60px;
     
    left:5px;
     
    }
     
    .phototable {
    position:relative;
    width: 752px;
    height: 500px;
    left:20px;
    }
    .headersection{
    position:relative;
    left:25px;
    }
    Last edited by Paul O'B; Feb 10, 2008 at 14:57.

  2. #2
    SitePoint Wizard bronze trophy Centauri's Avatar
    Join Date
    May 2007
    Location
    Newcastle, Australia
    Posts
    3,718
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I can't see any difference...

  3. #3
    SitePoint Member
    Join Date
    Jan 2008
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You dont get this ???
    [Check Attachments]
    Attached Images Attached Images

  4. #4
    SitePoint Addict
    Join Date
    Feb 2006
    Posts
    247
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yea, I see the gap. I can't really see what the problem is in your code. I see the big Image is the background of your body. I'd have to see the rest of the code.

    I kinda like the gap though. I thought it was neat looking.
    I live in Madison. Where in the W1RLD do you live?

  5. #5
    SitePoint Addict
    Join Date
    Feb 2006
    Posts
    247
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It got me thinking. Why don't you just photoshop a black bg into your image. The gap will still be there, but it will be black and look like it's flowing with the rest of the page.
    I live in Madison. Where in the W1RLD do you live?

  6. #6
    SitePoint Member
    Join Date
    Jan 2008
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    good idea like me make the bg black and see what happens

  7. #7
    SitePoint Member
    Join Date
    Jan 2008
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i officially hate FF lol...
    if anyone sees anything like me know thanks

  8. #8
    SitePoint Member
    Join Date
    Jan 2008
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Found out what it was

    .photoalbum{
    text-align: left;
    margin-top: 10px;

    }


Bookmarks

Posting Permissions

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