Verticla spacing of text in HTML / CSS

Dreamweaver & Flash (ahh ahhh) plus Web related Tutorials & Resources, HTML, CSS, PHP, Flash or whatever.
Post Reply
morphim
Site Admin
Posts: 609
Joined: January 5th, 2006, 2:21 pm
Location: Next Rock after the one Cow's at

Verticla spacing of text in HTML / CSS

Post by morphim » August 14th, 2006, 2:59 pm

Hello

This is what I have (dreamweaver screenshot) >>

Image

What I want to do is vertically centre the link text in the table cell (so it's inline with the little daisy spacers). I thought I could do it with padding in the CSS links but I can't. Any ideas?

Thanks

PS. Yes i am an HTML / CSS moron :D

Paul Stones
Ernie's rubber duckie
Ernie's rubber duckie
Posts: 283
Joined: January 6th, 2006, 11:00 pm
Location: Onanism zone

Post by Paul Stones » August 14th, 2006, 3:31 pm

Can you give us a link to the page/code?

odog
Big Bird's nest fluffer
Posts: 168
Joined: January 6th, 2006, 8:58 am
Location: The Emerald Isle (Oirland)
Contact:

Post by odog » August 15th, 2006, 11:24 am

Code: Select all

 td
{
vertical-align: middle;
}
That will vertically center all td elements.
The sooner you fall behind, the more time you have to catch up.

morphim
Site Admin
Posts: 609
Joined: January 5th, 2006, 2:21 pm
Location: Next Rock after the one Cow's at

Post by morphim » August 15th, 2006, 12:47 pm

Is that added within the TD <> html or CSS (I said I was a moron 8) )

Paul: This is all I have at present and it's not uploaded. Because I've rather foolishly decided to have the bottom of the daisy overlap the page, I've cut this portion off, made it a seperate image and lined it up on the right edge. (Actually, I wonder if this is what is stopping it working??)

However, the text of the nav looks odd being at the bottom, which is why I come sobbing to you kind folk.

I'll be back :D

odog
Big Bird's nest fluffer
Posts: 168
Joined: January 6th, 2006, 8:58 am
Location: The Emerald Isle (Oirland)
Contact:

Post by odog » August 15th, 2006, 1:56 pm

morphim wrote:Is that added within the TD <> html or CSS (I said I was a moron 8) )
Sorry Morph.

If you put that code in to the CSS it will vertically center every td element on the page. If you just want to apply it to one td element then you could use this CSS

Code: Select all

.nav td {
    vertical-align:middle;
}
and this to the HTML

Code: Select all

...
<table>
    <tr><td class="nav">Beautiful navigation</td></tr>
</table>
...
How's that for you?

Still using tables for layout are we, tut tut :wink: .
The sooner you fall behind, the more time you have to catch up.

morphim
Site Admin
Posts: 609
Joined: January 5th, 2006, 2:21 pm
Location: Next Rock after the one Cow's at

Post by morphim » August 15th, 2006, 2:30 pm

Cheers my friend :D

Haven't tried your suggestion yet but I'm guessing the best (and probably better way) would be css layout?

I just get thoroughly confused with the alignment stuff (absolute, float, relative) and stuff.

I just thought there'd be an easy way to move the text up a bit?
I'll have a fiddle.

Thanks again, Owen (and Paul for your reply too )

odog
Big Bird's nest fluffer
Posts: 168
Joined: January 6th, 2006, 8:58 am
Location: The Emerald Isle (Oirland)
Contact:

Post by odog » August 16th, 2006, 10:38 am

morphim wrote:Haven't tried your suggestion yet but I'm guessing the best (and probably better way) would be css layout?
You can still use the code I suggested with your table based layout. I wouldn't even dare to attempt a CSS based layout unless you were comfortable with it. The most digestable book I have come across is Bulletproof Web Design by Dan Cederholm. Quick and easy.

Any more trouble with the design, just shout :) .
The sooner you fall behind, the more time you have to catch up.

Simon
A Pig in Space
A Pig in Space
Posts: 484
Joined: January 7th, 2006, 10:55 am
Location: Devon
Contact:

Post by Simon » August 16th, 2006, 12:07 pm

tables, tut tut

The css way is the way. Dont worry about it as we are all here to help you through the tough times, and laugh at you on the funny times :shock:

No, help is always here
there is a god, and i am him

Post Reply