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 2 of 2
  1. #1
    New Coder
    Join Date
    Jul 2002
    Posts
    49
    Thanks
    0
    Thanked 0 Times in 0 Posts

    css - firefox on a mac problem

    I'm using the following css and it works fine in IE on a PC, Firefox on a PC and Safari on a Mac -but in Firefox on a Mac the div class I've defined as "title" is left justified within the div id "content" (not justified all the way to the left of the screen). Does anyone know a work around that doesn't mess up other browsers?

    Thanks!

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     
    <style type="text/css"> 
    html, body{height: 100%; text-align: center;}
    * {margin: 0; padding: 0;}
    #wrap {width: 1000px; min-height: 100%; height: auto !important; height: 100%;
    	margin: 0 auto -50px; /* the bottom margin is the negative value of the footer's height */
    	text-align: left; background: url(body.jpg) repeat-y;}
    #header {width: 1000px; height: 150px; background: url(composite.jpg) no-repeat;}
    #lcol {width: 187px; float: left; padding: 5px 0 0 0;}
    #content {margin: 0 20px 0 187px; padding: 5px 0 0 0;}
    #rcol {width: 20px; float: right; padding: 5px 0 0 0;}
    #footer, #push {width: 1000px; height: 50px; margin: 0 auto;}
    #footer {border-top: 2px solid black; background: #fff; text-align:right;}
    #push {clear: both; background:none;}
    .title {position:absolute; top:-32px; left:500px; padding-left:5px; padding-top:150px}
     </style>
    </head>
     
    <body>
    <div id="wrap">
    <div id="header"></div>
    <div id="lcol">
    blah blah - content
    <!--closes lcol --></div>
     
    <div id="rcol"><!--closes rcol --></div>
     
    <div id="content">
    <div class="title"><h1>title</h1></div>

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,737
    Thanks
    22
    Thanked 1,836 Times in 1,820 Posts
    Hello angyl,
    Looks like your code got cut off. A link to the test site would be easier.
    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
    •