Streaming live at 10am (PST)

CSS Help with centering


#1

CSS help. NYT logo is an image / jpg.

How do you center align the image and Text in a DIV.

Currently... both are in a div - centered (which it doesn't do).

The Image is fixed height @47px + float left.

This has to simple. For the life of me... I just don't see it.

Here's the image.


#2

Remove the float. Also make them both a block or a text. You can find this feature next to where the classes are named [4 different settings in all]. I would play around with it because I don't remember which one is the correct one. :slightly_smiling:

Hope this vague explanation helps. :wink:


#3

Thanks... I previously tried what you mentioned already :frowning:

I best I can get so far... (and I will keep playing with it) is

DIV (outer): block, centered
DIV (inner): in-line block
IMG: inline-block, auto-margin, float-left
TXT: block, auto-margin, left-padding 10px

BUT - with this... you lose control of the Text element's Vertical Padding.

You cannot add / subtract padding from the top or bottom.

If you look real close - you can see space between bottom of the text and the bottom of the logo.

Some people would let this go...

but - I am one of those pixel perfect people who are extremely anal about their work.


#4

BINGO !

DIV (outer): block, align-center
DIV (inner): in-line block
IMG: in-line block
TXT: left-padding 10px, position relative align bottom -NEGATIVE whatever value you need to position.

thanks @VladimirVitaliyevich for your input ! :smile:

Here's a :beer: for you :slightly_smiling:


#5

This topic was automatically closed after 60 days. New replies are no longer allowed.