SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Zealot
    Join Date
    Nov 2005
    Posts
    167
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Arrow Firefox -> text-align on rel position

    To make things easy... I have posted my code below and a diagram of what is happening. Basically I want the <h1> header to align in the center of the #header div box using relative positioning. But it is not working correctly in Firefox.

    #Header {
    width: 583px;
    text-align: center;
    padding-top: 60px;
    height: 40px;
    border: 1px solid #000;
    }

    #Header h1 {
    position: relative;
    top: 20px;
    width: 480px;
    padding: 5px;
    border: 1px solid #000;
    text-align: center;
    }

    Any help would greatly be appreciated! Thanks!
    Attached Images Attached Images
    Last edited by seodevhead; Jun 24, 2006 at 14:10.

  2. #2
    SitePoint Wizard drhowarddrfine's Avatar
    Join Date
    Aug 2005
    Posts
    3,438
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This should be working fine in FF. Post a link or the complete code.

  3. #3
    Non-Member
    Join Date
    Jan 2005
    Location
    Netherlands
    Posts
    4,300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello

    margin:0 auto; and something in the H1 to give it height

    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" xml:lang="en" lang="en">
    <head>
    <title>12345 12345 12345 12345 12345</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    	<style type="text/css">
    	*{padding:0;margin:0;}
    	
    	#Header{
    	width:583px;
    	text-align:center;
    	padding-top:60px;
    	height:40px;
    	border:1px solid #000;
    	}
    
    	#Header h1 {
    	position: relative;
    	top:20px;
    	width: 480px;
    	padding:5px;
    	border: 1px solid #000;
    	text-align: center;
    	margin:0 auto;
    	}
    	</style>
    	<script type="text/javascript">
    
    	</script>
    </head>
    <body>
    
    <div id="Header">
    <h1>&nbsp;</h1>
    </div>
    </body>
    </html>


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
  •