homepage Welcome to WebmasterWorld Guest from 54.205.241.107
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

    
absolute positioning different in ie, firefox, netscape?
ralphus33

5+ Year Member



 
Msg#: 6380 posted 4:44 am on May 1, 2005 (gmt 0)

Ok, I am new to css so I do not know a whole lot. Anyways I have adapted a template for a website I am making and it doesn't appear the same in all browsers. The problem is with absolute positioning of text. I designed it for internet explorer, so it appears where I want there, but in firefox and netscape it appears just a little bit lower and makes the website not appear how I would like. Is there just a difference in the browsers or something wrong with the coding? Is there a way to make it so it appears the same in all browsers? Here is the coding:
1) in the css:

.headertext {
position: absolute;
left: 460px;
top: 65px;
}

.headertextsub {
position: absolute;
left: 460px;
top: 100px;
width: 300px;
}

and 2) in the body:

<div class="headertext">
<h1>Header</h1>
</div>
<div class="headertextsub">
<h5>Subheader</h5>
</div>

 

tedster

WebmasterWorld Senior Member tedster us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 6380 posted 5:09 pm on May 1, 2005 (gmt 0)

Welcome to the forums, ralphus.

Absolute positioning is measured from the bounds of the containing element, which I am guessing is the <body> in your case. Different browsers have different defaults for margin (and padding) - have you set margin rules for the <body> element? That might do it.

Also, are you sure you want to use absolute position in this case? How about just letting the elements flow with the document. When they first begin to position elements with CSS, people often have a feeling that they always (or often) need to use relative and absolute position -- when that often complicates things unnecessarily.

The natural document flow is often the best place to start - no extra positioning rules at all, and that also helps to generate cleaner mark-up. You can always give your h tags some margin or padding if you want to see them indented.

ralphus33

5+ Year Member



 
Msg#: 6380 posted 6:06 pm on May 1, 2005 (gmt 0)

Thanks for the response. I just found where to correct it. One change I made caused discrepancy between browsers.

metagod

10+ Year Member



 
Msg#: 6380 posted 4:49 am on Jun 2, 2005 (gmt 0)

it would be good if you had showed us how you fixed the problem...

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved