HTML / CSS help?

[neocopernicus]

I hired someone to make me a MySpace layout (I'm not much of a designer), but we're having some issues. My profile is here. The issue is making every element line up so it is exactly in the same place on every browser. For example, there's supposed to be a scrolling text box on the orange box in the background, a comment box on the orange box in the foreground, the MP3 player is supposed to be buried in the ground, etc. Some of the stuff works (its an image map -- Mario is my pictures, the different "?" blocks lead to different things), but the difficult is lining up each element so its universal. Any help would be appreciated. Thanks!

[neocopernicus]

Here's some of the code:

--edited because issue was resolved and I didn't want to make the thread overly long--

[Mister X]

http://www.w3schools.com/Css/pr_class_position.asp
http://www.w3schools.com/Css/pr_pos_z-index.asp

Don't use percentages for absolute positioning, it defeats the entire purpose of fixed positions.

[neocopernicus]

http://www.w3schools.com/Css/pr_class_position.asp
http://www.w3schools.com/Css/pr_pos_z-index.asp

Don't use percentages for absolute positioning, it defeats the entire purpose of fixed positions.

Thanks. Your suggestion worked. :O Everything fits perfectly now.

[Mister X]

Huzzah!

MISSION COMPLETE.

And all I used to learn XML and CSS from ten years of Frontpage poisoning was Notepad (then Notepad++) and w3schools.org.

[neocopernicus]

Huzzah!

MISSION COMPLETE.

And all I used to learn XML and CSS from ten years of Frontpage poisoning was Notepad (then Notepad++) and w3schools.org.

Hm. Now the scrollbox isn't working on the pink block in Firefox. :/ It was earlier, but now it isn't (I don't know what I changed to enable it not to work?). It works in IE and Wii Opera.

Code: Select all

.div3{
position:absolute;
top:370px;
left:420px;
margin-left:-100px;
width:150px;
height:250px;
z-index:2;
padding:0px;
border:0px solid black;
background-color:transparent;
overflow-y: auto !important;
}

<div>
<style>
div.myspace-scrollbox {height:250;width:150;background-color:transparent;font-family:Arial;font-size:8pt;color:000000;text-align:left;border-width:1;border-style:solid;border-color:cccccc;overflow-y: auto !important;}
</style>
<div>
. . .
</div>


</div>

[neocopernicus]

Hm, this forum edits div tags. Perhaps understandably so. Just know that where it says <div>, there's something there.

[Mister X]

Why are you using negative margins with absolute positioning? Ah well, doesn't matter as long as it looks right. Well, I'm seeing scrollbars in the two left columns, so I'm not sure what you think is messing up.

[neocopernicus]

Why are you using negative margins with absolute positioning? Ah well, doesn't matter as long as it looks right. Well, I'm seeing scrollbars in the two left columns, so I'm not sure what you think is messing up.

I forgot to update you guys. :/ Its working now. Thanks for the help, though!