Why is this table not aligning my content?

[niwuc]

As you can see, I have a live twitter feed and two icons all contained into a table so they will align (its the only way I’ve been able to do this). Why does the table add an extra 13px to the feed? There is no margin style on any of the CSS or cell padding. Thoughts?

[niwuc]

Forgot the site! http://www.blinktankfilms.com

[wolfcry911]

my first thought is – never use tables for layout…

The reason there’s an extra 13 pixels at the top is that the images are aligned to the font baseline by default which pushes them up a little. You could set them to vertical align: bottom; or display: block; – either will work. But I’d try to redo it without the table. You should be able to float them without any trouble (and jnh will suggest inline-block ;)

[niwuc]

how would I apply the float to my css or inline block? would I turn each individual thing into a div?

[niwuc]

got it! thanks!

[wolfcry911]

I would change this

to this

and float the ul and img left with a width of 900 on the ul
edit// you don’t really need to wrap everything in a div to float. and I see that you added a third image. The triangle really should be a background image (its not content) perhaps on the ul and the inline styling isn’t good practice – move it to the stylesheet

[Author]

Posts