I would change the #banner h1 style to look like this:
#banner h1 {
/* float: left; */
background-color: #369;
color: #FFC20F;
font-size: 150%;
width: auto;
text-align: center;
}
You can't have float:left and text-align: center. In the above style, I have
commented out the first item and I suggest try it and post back.
hth
> I'm doing my first 'mobile' web site,
> and I'm having difficulties with centring text in the
> header.
>
> I've got a logo floated left, and a header also floated
> left to come up beside it and occupy all the remaining space
> to the right. I want the header text to be centred within
> that remaining space (whatever its width). However, I don't
> want to set a specific width because I'm trying to keep the
> layout fluid.
>
> http://www.holidaymullandiona.com/mobile/templates/hometemplate.html.php
> gives an idea of what I'm trying to do (even when viewed on
> a full-size monitor). The text 'Holiday Mull and Iona'
> should be horizontally centred in the blue area to the right
> of the logo. I'm viewing in FF6 at present.
>
> I've tried several combinations such as
> <h1><span>Heading text
> here</span></h1> with 'margin: 0 auto;' set on
> the span, but so far obviously not the right one. I've also
> tried 'text-align: center;', which worked on the UL below,
> but these have percentage widths.
>
______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
