Log In · Register

 
centering a div layout (firefox vs. internet explorer), centering a div layout (firefox vs. internet explorer)
sensime3na
post Nov 30 2007, 12:05 AM
Post #1


Newbie
*

Group: Member
Posts: 8
Joined: Nov 2006
Member No: 482,912



Okay I'm having trouble centering a profile layout I'm doing on myspace. This is the cod I have currently on one of my divs:

CODE
.box1 {background-color:000000;
background-image:url('http://i191.photobucket.com/albums/z30/shamrockmartialarts/themmastars.jpg');
background-repeat: no-repeat;

width: 750px;
height: 217px;
z-index:5;
top:130;
left:50px;
position:absolute;
visibility:visible !important;
overflow:hidden; border:0px solid white}


It doesn't really center it in the page, but when I follow something I found on Createblog.com, like this:

CODE
.box1 {background-color:000000;
background-image:url('http://i191.photobucket.com/albums/z30/shamrockmartialarts/themmastars.jpg');
background-repeat: no-repeat;

width: 750px;
height: 217px;
z-index:5;
top:130;
left:-375px;
margin-left: 50%;
position:absolute;
visibility:visible !important;
overflow:hidden; border:0px solid white}


It will center it perfectly in Firefox / Netscape, but when I try to view the page in Internet explorer it makes my image jump way far too the left, and doesn't center it.

Is this just one of those glitches with the differences between firefox and internet explorer? Or am I just coding it wrong?

I searched all through the scripts and tutorials, as well as all over the web--- can anyone help?

It would be wonderful....

Thanks,
Gemm
 
 
Start new topic
Replies
Insurmountable
post Nov 30 2007, 05:11 AM
Post #2


Cornflakes :D
*******

Group: Staff Alumni
Posts: 4,541
Joined: Dec 2005
Member No: 322,923



Ah I'm one of those people that has to have everything exactly perfect and I ask a million people if its centered xD

But yea when you make divs code them like this:

Properties:
CODE
<Style>
.Test{
    border:0px solid;
    border-color:none;
    width:760px;
    height:770px;
    overflow:auto;
    position:absolute;
    left:50%;
    top:0%;
    margin-left:-390px;
    margin-top:100px;
    text-align:center;
    visibility:visible;}
</style>


Then the Div:
CODE
<div class="test">
CONTENT FOR DIV
</div>



If you need it explained at all feel free to ask.

Also one thing about myspace and centering divs..just center it by the ad. Make sure there is the same amount of pixels on both sides. If you don't know how to do that, if your using firefox use the measureit extension..

Download that here:
https://addons.mozilla.org/en-US/firefox/addon/539

Its a really nifty convenient tool to have _smile.gif
 

Posts in this topic


Closed TopicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members: