CSS Help with centering

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.

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_face:

Hope this vague explanation helps. :wink:

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.

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 :slight_smile:

1 Like

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