css heading valignment

  Jarvo 13:54 29 Jan 04
Locked

Hi

just started playing with css and curently building a website using FP2003, along with manual code edditing. What I would like to know can you get css formating to set a headings vertical alignment as currently my headings are sitting top. Now I can work round this by adding another table row but would like to do this with css if pos


Jarvo

  Jarvo 20:27 29 Jan 04

^bump

  Jarvo 20:16 30 Jan 04

^

  PurplePenny 21:24 30 Jan 04

Not quite sure what you mean. Where do you want them to align? Would one of these do what you want?

vertical-align: baseline;

vertical-align: middle;

vertical-align: text-bottom;

vertical-align: bottom;

Penny

  Jarvo 22:16 30 Jan 04

Hi

I am formating headings as

h3 {font-size: 13pt Lucida Sans,Arial,Verdana;


font-weight: bold;


line-hight: 14pt;}

My headings are enclosed in a table cell and the heading always sitts top at the top of the cell, with a space of approx font below. Regardles of which commands I use line-hight, vertical-alighnment I get the same result which causes the top headings to be a litle to close to my Title Giff cell. my css sheet appears to work as changes fonts but not Heading alighnment.

  PurplePenny 23:00 30 Jan 04

Have you tried adding some padding-top?

Penny

  Goatee 01:39 31 Jan 04

Lose the line-height and just add:

padding: 5px 0px 5px 0px;

padding values are ordered like this:
top, right, bottom, left (ie clockwise).

Just replace the 5px with whatever value you need. Heres something that I've been working on:click here

I only starting working with CSS last week but I reckon I've done ok with this. So hopefully it might help you out.

An excellent resource is here: click here

The Zen Garden really does show the power of CSS. All the pages have the same source code, just a different style sheet. I'm sure you will find some inspiration there.

Try to cut out the tables though. I've got just the one table on my site, I certainly won't have anymore.

Keep at it though and you will soon realise how powerful CSS is :)

  Goatee 01:43 31 Jan 04

PS. Don't follow the links on my webpage as they either won't work or they will take you to my other site. Its only the homepage that is present for now.

Take a look at the source code and you will see how code you can lose just by using CSS :)

Anyway, hope you getting the alignment sorted :)

  Jarvo 18:52 31 Jan 04

Many thanks to you both Learning css and trying to resist going back to html formating is proving a chalange at the moment although I am finding it fun if a little fustrating at times.

I am still busy buliding the site and faffing on with Layout graphics and copy. The book I have on html has only a basic introdution to css and dose not mention padding, now I think of it it is obvious will give it a go tommorrow after having a good read of your links.

I will post to let you know how I get on many thanks

Jarvo

Goatee nice to see a fellow north eastener on the forum ;-)

  Goatee 19:12 31 Jan 04

No problem, Jarvo :o)

CSS is definately worth the effort and it becomes quite simple after a bit of practice. The only struggle I had was to get the page to diaply as intended across a number of browsers, sorted now though. Just make sure you consistently check your work in different browsers while developing. Firebird is more strict on standards so worth checking in there. Once you have a CSS based site then updating the style will be a doddle :o)

Ahhh, so you know Bike Scene? Or did you go to trailblasters.co.uk?

Have fun :o)

  Jarvo 15:28 01 Feb 04

Many thanks to you both problem solved !


Goatee

If I went any futher than the corner shop on my bike I think I would have a heart attack :-)

Like your site though


Jarvo

This thread is now locked and can not be replied to.

Best phone camera 2016/2017: Galaxy S7 vs iPhone 7 vs Google Pixel vs HTC 10 Evo vs OnePlus 3T vs…

1995-2015: How technology has changed the world in 20 years

These are the Best Christmas Ads and Studio Projects of 2016

Super Mario Run preview | Hands-on first impressions of Super Mario Run: Mario's iPhone & iPad…