Velocity Reviews

Velocity Reviews (http://www.velocityreviews.com/forums/index.php)
-   HTML (http://www.velocityreviews.com/forums/f31-html.html)
-   -   CSS Vertically Align Text (http://www.velocityreviews.com/forums/t229268-css-vertically-align-text.html)

Trevor 04-28-2006 09:58 PM

CSS Vertically Align Text
 
Note the following html code:

<div id="linkbar">
<p>
links
</p>
</div>

Now take a look at this CSS:

#linkbar {
height: 30px;
text-align: center;
}

#linkbar p {
vertical-align: middle;
}

Why isn't the text in the div aligned vertically? What's the best way
to do what I want?

Thank you,
Trevor


Barbara de Zoete 04-28-2006 10:02 PM

Re: CSS Vertically Align Text
 
On Fri, 28 Apr 2006 23:58:56 +0200, Trevor <trevordixon@gmail.com> wrote:

> Note the following html code:
>
> <div id="linkbar">
> <p>
> links
> </p>
> </div>
>
> Now take a look at this CSS:
>
> #linkbar {
> height: 30px;
> text-align: center;
> }
>
> #linkbar p {
> vertical-align: middle;
> }
>
> Why isn't the text in the div aligned vertically?


Vertical align is a property that works with table cells only.


> What's the best way
> to do what I want?


Add display:table-cell; to the selector #linkbar p


--
______PretLetters:
| weblog | http://www.pretletters.net/weblog/weblog.html |
| webontwerp | http://www.pretletters.net/html/webontwerp.html |
|zweefvliegen | http://www.pretletters.net/html/vliegen.html |

Neredbojias 04-28-2006 10:53 PM

Re: CSS Vertically Align Text
 
To further the education of mankind, "Trevor" <trevordixon@gmail.com>
vouchsafed:

> Note the following html code:
>
> <div id="linkbar">
> <p>
> links
> </p>
> </div>
>
> Now take a look at this CSS:
>
> #linkbar {
> height: 30px;
> text-align: center;
> }
>
> #linkbar p {
> vertical-align: middle;
> }
>
> Why isn't the text in the div aligned vertically? What's the best way
> to do what I want?


Add this line to #linkbar p {

line-height: 30px;


--
Neredbojias
Infinity has its limits.

Trevor 04-29-2006 01:07 AM

Re: CSS Vertically Align Text
 
Awesome, thanks.


Toby Inkster 04-29-2006 02:15 PM

Re: CSS Vertically Align Text
 
Barbara de Zoete wrote:

> Vertical align is a property that works with table cells only.


vertical-align also applies to images. (And other replaced content??)

--
Toby A Inkster BSc (Hons) ARCS
Contact Me ~ http://tobyinkster.co.uk/contact
Now Playing ~ ./embrace/out_of_nothing/06_keeping.ogg


Barbara de Zoete 04-29-2006 02:31 PM

Re: CSS Vertically Align Text
 
On Sat, 29 Apr 2006 16:15:39 +0200, Toby Inkster
<usenet200604@tobyinkster.co.uk> wrote:

> Barbara de Zoete wrote:
>
>> Vertical align is a property that works with table cells only.

>
> vertical-align also applies to images. (And other replaced content??)


Ah. Thank you. Good to know.


--
______PretLetters:
| weblog | http://www.pretletters.net/weblog/weblog.html |
| webontwerp | http://www.pretletters.net/html/webontwerp.html |
|zweefvliegen | http://www.pretletters.net/html/vliegen.html |


All times are GMT. The time now is 12:11 PM.

Powered by vBulletin®. Copyright ©2000 - 2014, vBulletin Solutions, Inc.
SEO by vBSEO ©2010, Crawlability, Inc.