Hello!

 

I've been trying to vertically centre some text on a site with no luck

I managed to get it to work in FF but not in IE. After more attempts im back to square one - not even working in FF!

 

I've googled how to's but cannot get it to work Can any of you guys give me a hand with this?

Here is the site: My link : and I am trying to get the text in the gray bar vertically aligned center.

Before and next to each flag image.

 

 

Thanks in advance.

Hi,

 

the way i've done it before is to have the links as a horizontal unordered list and perhaps have a bottom margin?

i'm trying to edit your page 'on the fly' but the structure of the page and the positioning of the divs are proving quite difficult

i'm trying to edit your page 'on the fly' but the structure of the page and the positioning of the divs are proving quite difficult

yeah its a template we use at work, so unless your used to the layout its tricky

hey up!

#flags {
color:#FFFFFF;
font-size:14px;
font-weight:normal;
height:42px;
margin-left:0;
padding-left:0;
position:absolute;
text-align:center;
top:106px;
width:900px;
z-index:5;
}

This works in IE7 and Firefox - tested OK:-

#flags{                              
position:absolute;
height:42px;
width:800px;
margin-left:10px;
top:106px;
/*margin-left:650px;
top:28px;*/
color:#FFF;
font-size:14px;     line-height: 40px;
z-index:5;
font-weight:normal;
text-align:left;
padding-left:10px;
}

#flags a {
	color:#fff999; 
}
#flags img { vertical-align: middle; }	

.middle-text {
	padding:0 20px 0 0; /*was 0 20px 30px 0px;*/
}

#flags p {  
	display:inline;
	padding:0 20px 0px 0;        /*was 0 20px 30px 0px;*/
}

 

Essentially line-height increased to height of flags and bottom padding removed (not needed) and vertical-align: middle added.

Thanks for the replies.

 

Wickham - it works a treat thank you.

I can know take a look and learn this technique.

 

Thanks again.

Glad to help; thanks for the rec.