PDA

View Full Version : Different view in IE or Mozilla



toplisek
04-18-2006, 12:03 PM
I have code for steps with css and div:


<div id="steps" align="center" >

<img src="Images/step1_on.gif" width="29" height="29" align="absmiddle" />

<span class="step_label">Account information</span>


<img src="Images/step2_off.gif" width="29" height="29" align="absmiddle" />

<span class="step_label">E-mail with link to activate account</span>


<img src="Images/step3_off.gif" width="29" height="29" align="absmiddle" />


<span class="step_label">Activate your account</span>

<img src="Images/step4_off.gif" width="29" height="29" align="absmiddle" />

<span class="step_label2">Finish</span>


</div>


and css like e.g.:


#steps {background-image:url('slike/step_bg.gif');background-repeat:repeat-x; height:29px; margin:0px 0px 20px 0px;}
.step_label {height:29px; padding:8px 15px 0px 3px; font-weight:bold; color:#1e4e7f;}
.step_label2 {height:29px; padding:8px 0px 0px 3px; font-weight:bold; color:#1e4e7f;}


why is text not in the middle (vertical) of colour in IE? In Mozzila it works. :)

Twey
04-18-2006, 12:44 PM
You're relying on pixel values. The position will differ depending on resolution and window size.

toplisek
04-19-2006, 07:37 AM
What I should change that it will work vertical postion of text in the middle? I have the same code for IE and Mozilla and the same resolution. So, window resolution should not be problem.

Twey
04-19-2006, 03:27 PM
Well yes, actually, it should.
#steps {background-image:url('slike/step_bg.gif');background-repeat:repeat-x; height:29px; margin:0px 0px 20px 0px; text-align:center; }

toplisek
04-19-2006, 03:35 PM
I have changed as your code. It is the same result in IE. Text is not in the middle 8vertical).

Twey
04-19-2006, 04:20 PM
Ah, vertically? Try:
#steps {background-image:url('slike/step_bg.gif');background-repeat:repeat-x; height:29px; margin:0px 0px 20px 0px; text-align:center; vertical-align: center; }

toplisek
04-19-2006, 04:27 PM
Ah, vertically? Try:
#steps {background-image:url('slike/step_bg.gif');background-repeat:repeat-x; height:29px; margin:0px 0px 20px 0px; text-align:center; vertical-align: center; }

I have tried also vertical-align: center; and vertical-align: middle; but there is no change in IE. Even vertical-align: top has no results.

Twey
04-19-2006, 05:08 PM
It could be due to that margin... try removing it.

toplisek
04-19-2006, 05:35 PM
I have removed margin:0px 0px 20px 0px;
but the same story.