Topic: It's a Browser Thing... Pages that link to <a href="https://ozoneasylum.com/backlink?for=22473" title="Pages that link to Topic: It&amp;#039;s a Browser Thing..." rel="nofollow" >Topic: It&#039;s a Browser Thing...\

 
Author Thread
templar654
Bipolar (III) Inmate

From: Aiur, the Tarsonian Galaxy
Insane since: Apr 2004

IP logged posted posted 07-08-2004 04:12 Edit Quote

OK I am going crazy here! my first try at my new site was ok as far as IE is concerned but Opera and everything else was mushed up, FireFox was ok. My second try fixed Opera but FireFox was all wrecked up! Here's a link to a page I uploaded:

http://www.freewebtown.com/haiderali/latest/home.htm

Here's a link to the default CSS:

http://www.freewebtown.com/haiderali/latest/default.css

Right now I'm startin' to think the browser's are out to get me! If anyone knows what digs please I'm desperate!!!


Online Portfolio

MalFunkShun
Maniac (V) Inmate

From: few miles outside philly
Insane since: Jul 2001

IP logged posted posted 07-08-2004 05:16 Edit Quote

have you ever thought about placing your #content as "absolute" and have it be 48px from top and setting the background image as a "gif" of the two shade grey. Place the rounded off bottom at the end of the content as a seperate gif. or set up as a div relative to the content div.


here's a start

#content {
text-align: left;
margin-top: 48px;
width: 655px;
position: absolute;
background: transparent url("images/bottom.gif") bottom no-repeat;
}

by the way your design and colors look really cool.


EDIT: Yeah I spent a few more minutes looking at it and I got some things to work. The best I can tell you from here is to think like a table but don't use tables. for your #main I would have a box placed in the center of the page. Could be done as easily as

<div align = "center"><div class="main>content</div></div>

I would personally, though few people may disagree, place all your content relative inside main. This should help avoid overlapping of divs.

#nav
#right
#content
#bottom
#disclaimer

I haven't tried any of this myself on your code but I would give it a shot and work from there.



(Edited by MalFunkShun on 07-08-2004 05:48)

H][RO
Bipolar (III) Inmate

From: Australia
Insane since: Oct 2002

IP logged posted posted 07-08-2004 06:24 Edit Quote

Trying adding
height: auto;

to the elements that are giving you trouble.

In IE. if you set a height say 50.. and it has content that would make it bigger than 50, then the element will expand.. However in Opera, Moz etc it will not. So keep that in mind.

templar654
Bipolar (III) Inmate

From: Aiur, the Tarsonian Galaxy
Insane since: Apr 2004

IP logged posted posted 07-09-2004 02:59 Edit Quote

Well I tried doing that MalFunkShun but just didn't work some of the stuff got shifted here and there. Why do Mozilla and FireFox behave like this? I've worked with Netscape and even it doesn't mess up the way they do.


Online Portfolio

DL-44
Maniac (V) Inmate

From: under the bed
Insane since: Feb 2000

IP logged posted posted 07-09-2004 15:21 Edit Quote

Don't have much time at the moment, but a couple of notes -

1) Do *not* use absolute positioning for this - there is absolutely no need and it will only cause more problems.

There's also no need to use a deprecated property like align="center"

Overall you CSS looks pretty good - nice and simple and clean. No need to specify 'position:relative;' in any of those divs though - I'd take that out.

I can't say specifically what the problem is at the moment, but I would suggest that you try to cut down on the nested divs. It seems like a few places have a 'wrapper inside a wrapper inside a wrapper....' going on.

One final note (for now) - it's not that Mozilla and Firefox are 'messing up'. It's that you're not yet understanding how they are interpreting the code. Just because IE likes your code doesn't make it "right"

I'll try to play around with this later today if I can...



Post Reply
 
Your User Name:
Your Password:
Login Options:
 
Your Text:
Loading...
Options:


« BackwardsOnwards »

Show Forum Drop Down Menu