PDA

View Full Version : CSS alignment help


Geometric-sama
April 9th, 2007, 05:38 AM
Yeah... even I need help sometimes. XD;

So... I have this page. http://www.ryux.net/mucsa/ I want all the text in the navigation buttons to go to the bottom of the buttons (they're sitting at the top at the moment), and I can probably do that using some crappy nesting hack, but I'd like to do it without if possible. My vertical-align: bottom; attribute is set, and I've tried display: inline and display: table-cell (apparently the only ones for which vertical-align has any meaning) with no luck. Any ideas? If not, I'll just resort to the hack. XD;

Ausaudriel
April 9th, 2007, 06:28 AM
line-height: 9.6; in #navbar .button looks about right in Firefox. Might cause some issues in other browsers, though.

Geometric-sama
April 9th, 2007, 01:26 PM
Yeah, it breaks horribly in IE6 (I don't have IE7 installed).

The current hack I'm using, which nests a div and a p inside #navbar .button (since you have to have the parent relative and the child absolute), looks fine in Firefox and Opera, but breaks pretty horribly in IE6.

Edit: It's fixed-ish in IE now (have a look if you like), it was as simple as adding a left: 0px;. IE6's poor support for CSS borders means it doesn't look too good there, though; anyone with IE7 care to tell me how it looks there?