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.
Page 1 of 2 12 LastLast
Results 1 to 15 of 17
  1. #1
    New to the CF scene
    Join Date
    Nov 2008
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Thumbs down CSS gurus, what is wrong with my page ?

    My home page is at :
    http://alltherides.com

    It appears fine on my machine (FF IE both) . But on certain computers typically with old browsers it looks all messed up. That is the right of the page starts shifting over.

    Please look at attached images

    please recommend a solution. This keeps me up at nights.
    Attached Thumbnails Attached Thumbnails CSS gurus, what is wrong with my page ?-atr-mainpage-ie.jpg   CSS gurus, what is wrong with my page ?-atr-mainpage-ff.jpg  

  • #2
    Senior Coder
    Join Date
    Oct 2005
    Posts
    1,340
    Thanks
    0
    Thanked 61 Times in 60 Posts
    Define "older browsers". But you have 69 html errors and 67 CSS errors.

  • #3
    Regular Coder FWDrew's Avatar
    Join Date
    Apr 2008
    Location
    Missouri
    Posts
    380
    Thanks
    38
    Thanked 45 Times in 43 Posts
    And I think you have a syntax error on line 112

    Please post some code or a link.

    Regards,

    Drew
    Dev-Tips.com || Employee at the Envato Network || My Portfolio

  • #4
    New to the CF scene
    Join Date
    Nov 2008
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts
    well here is my CSS file:

    Code:
    body{
    margin:0;
    padding:0;
    line-height: 1em;
    }
    
    img{ border-style:none;
    
    
    }
    
    b{font-size: 110%;}
    em{color: red;}
    
    
    #topsection{
    
    height: 100px; /*Height of top section*/
    width: 100%;
    background:url(../../../images/logo.jpg) no-repeat; 
    
    }
    
    #topsection a{
    color:#CCCCCC;
    
    }
    
    
    
    #navheader{
    /*background:#C0C8DD;*/
    
    background:#4A7BB5;
    height: 31px; /*Height of top section*/
    
    }
    
    
    #navheader a{ color:#CCCCCC;
    }
    
    
    
    #topsection h1{
    margin: 0;
    padding-top: 15px;
    }
    
    #contentwrapper{
    float: left;
    width: 100%;
    }
    
    #contentcolumn{
    margin: 0 15% 0 20%; /*Margins for content column. Should be "0 RightColumnWidth 0 LeftColumnWidth*/
    }
    
    #leftcolumn{
    float: left;
    width: 20%; /*Width of left column in percentage*/
    margin-left: -100%;
    /*background:#C0C8DD;*/
    
    background:#4A7BB5;
    }
    
    #rightcolumn{
    float: left;
    width: 17%; /*Width of right column in pixels*/
    margin-left: -17%; /*Set margin to that of -(RightColumnWidth)*/
    /*background:#C0C8DD;*/
    
    background:#4A7BB5;
    }
    
    #footer{
    clear: left;
    width: 100%;
    background: #3B5998;
    color:#CCCCCC;
    text-align: center;
    padding: 4px 0;
    }
    
    #footer a{
    
    color:#FFFFFF;
    }
    
    
    .innertube{
    margin: 10px; /*Margins for inner DIV inside each column (to provide padding)*/
    margin-top: 0;
    }
    
    
    .category_header {
    	font-family: Verdana, Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	font-weight: bold;
    	color:#FFFFFF;
    	background-color:#3B5998;
    	
    	text-align:center;
    	
    }
    .category_listing {
    	font-family: Verdana, Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	color: #006699;
    }
    
    
    a {
    	FONT-WEIGHT: bold;
    	FONT-SIZE: 10px; COLOR: #006699;
    	FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; TEXT-DECORATION: none;
    
    }
    
    a:hover {color: #ffffff; background-color:#006699;}
    
    
    .form_text {
    	font-family: Verdana, Arial, Helvetica, sans-serif;
    	font-size: 12px;
    }
    .bold_red {
    	font-family: Verdana, Arial, Helvetica, sans-serif;
    	font-size: 16px;
    	font-weight: bold;
    	color: #FF0000;
    }
    
    .latest_rides{ 
    
    }
    
    .latest_rides a {
    font-size:54%;
    font-weight:bold;
    }
    
    
    .viewlisting_header_text{font-size:24px;
    font-weight:bolder;
    }
    
    .news_column a {
    
    }
    
    .greenmoney {
    
    color: #009900;
    font-size:12px;
    
    }
    
    
    .columnText {
    font-size:12px;
    }
    
    .topnavlinks {
    color:#000000;
    }
    
    .didyouknow{color:#FF6600;
    font-stretch:semi-expanded;
    font-weight:700;
    
    }
    
    .vin {
    font-size:16px;
    font-weight:bold;
    
    }
    
    
    }

  • #5
    New to the CF scene
    Join Date
    Nov 2008
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Ok call me a nube but what do you mean by 69 html errors and 67 CSS errors?

  • #6
    New to the CF scene
    Join Date
    Nov 2008
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Oh yeah I just them out on the validator hmmmm

    funny thing is this thing was w3 compatible a few weeks ago

    hmm

  • #7
    Regular Coder Doctor_Varney's Avatar
    Join Date
    Mar 2008
    Location
    Midlands, UK
    Posts
    649
    Thanks
    45
    Thanked 29 Times in 28 Posts
    Quote Originally Posted by 2levelsabove View Post
    funny thing is this thing was w3 compatible a few weeks ago
    Try adding more salt, or store at a lower temperature...?

    Definition: Computer rage is a heightened physiological response with associated feelings of anger and frustration[1] resulting from using a computer or other complex electronic device. It may result in the physical assault of the computer or similar item.[2] Computer use often leads to verbal abuse and occasionally physical violence towards the object.[3] Computer rage may be caused by distress due to a hardware or software problem which the enraged person is unable to correct.

  • #8
    New to the CF scene
    Join Date
    Nov 2008
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts
    great helpful post there.

  • #9
    Regular Coder Doctor_Varney's Avatar
    Join Date
    Mar 2008
    Location
    Midlands, UK
    Posts
    649
    Thanks
    45
    Thanked 29 Times in 28 Posts
    You could always officially thank me...

    (CSS is sometimes very frustrating. I often find a little humour helpful, even if it does not solve the issue.)

    Is the page working how you intend it, now you have fixed the errors?

    Definition: Computer rage is a heightened physiological response with associated feelings of anger and frustration[1] resulting from using a computer or other complex electronic device. It may result in the physical assault of the computer or similar item.[2] Computer use often leads to verbal abuse and occasionally physical violence towards the object.[3] Computer rage may be caused by distress due to a hardware or software problem which the enraged person is unable to correct.

  • #10
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,863
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    @2levelsabove

    I'd recommend you to read "Why tables for layout is stupid?" and then check http://www.bonrouge.com/3c-hf-fluid.php, which is a good 3-column layout in CSS.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • Users who have thanked abduraooft for this post:

    2levelsabove (11-12-2008)

  • #11
    New to the CF scene
    Join Date
    Nov 2008
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Thanks a lot.

    I will take a look at that.

  • #12
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    Doctor Varney said:-

    (CSS is sometimes very frustrating. I often find a little humour helpful, even if it does not solve the issue.)
    A man after my own heart. One can be too serious at times.

    Frank
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #13
    Regular Coder
    Join Date
    May 2008
    Location
    Oxford, UK
    Posts
    422
    Thanks
    14
    Thanked 27 Times in 27 Posts
    There's a time and a place

  • #14
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    Quote Originally Posted by brazenskies View Post
    There's a time and a place
    Define it then.

    Frank

    'nuff said?
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #15
    Regular Coder Doctor_Varney's Avatar
    Join Date
    Mar 2008
    Location
    Midlands, UK
    Posts
    649
    Thanks
    45
    Thanked 29 Times in 28 Posts
    What's that, my old cognitive behaviour therapist said...? "You can't control CSS, but you can control your reaction to it...?" Well, I'm not so sure about that, sometimes...
    Definition: Computer rage is a heightened physiological response with associated feelings of anger and frustration[1] resulting from using a computer or other complex electronic device. It may result in the physical assault of the computer or similar item.[2] Computer use often leads to verbal abuse and occasionally physical violence towards the object.[3] Computer rage may be caused by distress due to a hardware or software problem which the enraged person is unable to correct.


  •  
    Page 1 of 2 12 LastLast

    Tags for this Thread

    Posting Permissions

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