...

View Full Version : Stuck on Centering for ages



adobe2
10-01-2007, 12:10 PM
I've been stuck on this problem trying to center this banner....

test page


<html>
<head>
<LINK href="/images/la.css" type=text/css rel=stylesheet>
</head>
<body>
<DIV id=back_bg></div>
</body>
</html>


la.css



body{
margin: 0 auto;
width: 1000px;
}

#back_bg {
Margin: 0 auto; background: url(back.gif); width: 900px; position: absolute; height: 450px
}



It centers on firefox fine, but wouldn't center on IE. Its always stuck to the left side! what am i doing wrong?

effpeetee
10-01-2007, 12:21 PM
<body>
<DIV id=back_bg></div>

shouldn't it be:-

<body>
<DIV id="back_bg>"</div>

with " quotes.

Frank

adobe2
10-01-2007, 12:36 PM
doesn't work either.

effpeetee
10-01-2007, 12:41 PM
Really need access to the url. The fault may lie elsewhere.
Have you validated it.

http://validator.w3.org/#validate_by_uri:)

also what version of IE

Frank

adobe2
10-01-2007, 12:43 PM
I've copied and pasted the contents of both files I'm using in here... there are no other files, u can try using any picture of your choice. It just wouldnt' center

Im using IE6

effpeetee
10-01-2007, 01:44 PM
I cannot get it to centre (using my image) on IE, Firefox or Opera.

This url may help you.

http://komodomedia.com/blog/index.php/2006/07/09/css-trickery-part-2-horizontally-centering/

could you send a screen shot so that we know what to expect.
Frank

effpeetee
10-01-2007, 03:11 PM
This works for me.:thumbsup:

Very useful site. http://www.w3schools.com/css/tryit.asp?filename=trycss_background-position

Frank


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<style type="text/css">
body
{
background-image: url(3a.jpg);width: 80px; height: 60px;
background-repeat: no-repeat;
background-position: center center;


div#container
{
margin-left: auto;
margin-right: auto;
width: 50em;
text-align: middle;
}</style>

<LINK href="/images/la.css" type=text/css rel=stylesheet>
</head>
<body>
<DIV id=back_bg></div>
</body>
</div>
</html>

adobe2
10-02-2007, 09:53 AM
Got it! Thank you very much!

adobe2
10-04-2007, 12:47 PM
I have another problem...

this time its like this. I've added this picture as the background... its centered on a maximized screen. Everything looks fine. However, things look messy when I resize the screen so that the window size is smaller than the background image. In IE, everything is okay still. When the window is smaller, all the white space between the picture and the left side edge of the browser is automatically reduced, and I'm left with the left side edge of the picture on the left side edge of the browser. Which is how its meant to go.

However, in Firefox, when I reduce the window size, the picture moves along with the window. The left side edge keeps going and disappears off the screen. So I'm left a portion of the image remaining, and this remaining portion gets smaller the smaller I make the window.

Has anyone encountered this problem before? If so, how to solve it? Cheers.

Suka



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum