Anyone know CSS? Help needed!

Status
Not open for further replies.

RedDwarf

Smegging smeg of a smeg!
I'm trying to make a banner centered and can't seem to get it working right in IE. Mozilla is no problem, it's where I want it using the code below. In IE it sits to the top left and doesn't move regardless of changes I make.

Code:
#header {
	height : 95px;
	float : left;
	width : 100%;
	margin-left: 210px;
	padding : 0;
	background-repeat : no-repeat;
	overflow: hidden;
	background-image: url(../images/header.gif);

This is from a pre-made template, so I don't really want to get into adding html div's or anything if possible, I'd like to alter this in the CSS. Thanks!
 
Yeah, I have no idea why that's there. Removing it completely or changing left to right does nothing.
 
That "float:left;" is the most likely culprit.

EGM92: text-align isn't always the best option; it won't always work for images, for instance.
 
EGM92, tried that, no change.

I hate that IE and everything else renders CSS differently, so annoying.
 
If your structure is something like:

Code:
<#container>
	<#header>
		<p>FOO</p>
	</#header>
	<#content>
		<p>BAR</p>
	</#content>
</#container>

Then try:

Code:
<style type="text/css">
#container {
	width: 200px; /* Or whatever */
	text-align: center;
	background-color: black;
}
#header {
	width: 100px; /* Or whatever */
	margin: 0 auto;
	text-align: left;
	background-color: white;
}
</style>
 
Thanks for the assist all, I ended up resizing the image as a quick fix while I was at work. I'll play around with the suggested code tonight.
 
Oh, if your header image is a background-image on a 100%-width div, it's no wonder you're not getting the result you want. So stop doing that.
 
Status
Not open for further replies.
Top Bottom