A button has gone wrong in IE but works in FF

[Paul Keely]

www.londonpahomestay.com

If you look at the site in Firefox, you won't have the problem I'm talking about but if you have Internet Explorer, you will.

I'm sick and tired of creating sites that look good and work well in Firefox but rubbish in IE, so I'm just gonna have to work in IE from now on, I hope. Unless there is any way you can both make them look the same...

But anyways, on the right hand side there are two buttons saying Patricia and Agatha. In Firefox those words are in the centre but in IE they are left aligned. How do I fix this?

Also, I added a bit of virtual pagination script so that when you click on the Patrica button, her picture appears with text under it. Again, in FF it looks perfect, but in IE it seems to disappear when you click on it, but it's just gone underneath the whole page, with the picture not going underneath the button. Also, the text is in a horrible thin column (again, not like that in FF). How do I solve this?

Another thing: the menu column. The white rows are all aligned to the right, but I would like them in the centre of that column. How do I do that?

Thanks for any and all help. I really appreciate it.

ps The title bar at the top is buggered too. Anyone know how I fix that? I've tried making the text smaller, but the white bar just gets smaller, too, and it isn't aligned in the centre. Again, it works fine in FF but not in IE.

[Veronica]

For the title bar problem, try losing the "line-height: 0%;" in the css. In IE, setting the line-height to 0 makes the text move up so high, it loses the top half of the letters.

For centering the left navigation bar, try adding margin-left and margin-right tags:

ul.navbar { list-style-type: none;
  			padding: 0;
  			position: relative;
  			top: 0em;
  			left: 0em;
  			width: 10em 
                        margin-right:auto;
                        margin-left:auto;}