|
| |
Site members can create their own journals and post comments. | CSS Help 01-13-2007 at 11:40 am
I'm attempting to learn the "correct and proper" way to code HTML, separating content from style, and using divs instead of tables. Doesn't seem like it should be that tough, but I'm running into problems with some of the basics. Thanks to any web gurus who can help me out with a specific question.
If I have a div tag that has a height set to 50, and I want the inner text to display centered vertically, what style do I set? I thought vertical-align:middle would do it, but it don't.
Example:
<div style="
border: 1px solid White;
height: 50px;
width: 300px;
vertical-align:middle">
Inner Text
</div>
yeilds this:
Inner Text
|
Posted Comments Registered site members may leave comments.
jwalker 01-13-2007, 12:49 pm
Thanks, I have those tints already. but couldn't find an answer the or on Google.
Anyone happen to know the answer?
|
jwalker 01-13-2007, 12:51 pm
^tints = links
(bad character recognition - lol)
|
casmhar 01-13-2007, 01:28 pm
p align = "center" your text /p
|
vasudeva 01-13-2007, 02:05 pm
Centering elements vertically, as I recall, is one of those tough-to-do-cleanly-with-CSS things. I'm sure you could hack something up that would achieve it, like screwing with the box model attributes of your container or applying padding to the element, but I don't think there's a clean reliable way to get what you want using untricky CSS.
|
jwalker 01-13-2007, 02:05 pm
That aligns horizontally, not vertically. Besides - I want a CSS solution, not inline formatting.
<div style="
border: 1px solid White;
height: 50px;
width: 300px;
vertical-align:middle">
<p align="center">Inner Text</p>
</div>
The question remains...
|
jwalker 01-13-2007, 02:11 pm
vasudeva: Can't be done.
hmph. That seems like a serious oversight, but oh well. I'll use a table for that part, and follow up here if I find a better way. thx
|
jwalker 01-13-2007, 03:33 pm
Phil: vertical means up <-> down
|
vasudeva 01-13-2007, 03:41 pm
Haha. Way to go, phil.
|
IMBOLCPunxsutawneyPhil 01-13-2007, 04:04 pm
ok fucks it. I am not gonna recreate the wheel.
http://www.student.oulu.fi/~laurirai/www/css/middle/
margin paddings, and absolute/relateive positioning of inline elements.
[I seriously thought there was an attempt to center text, not vertically. really. ]
|
jwalker 01-15-2007, 09:57 pm
I found some info here.
It's a total kludge, and I don't plan to use it - plus, looking at how it renders here, it obviously doesn't work quite right under certain conditions:<div style="border: 1px solid White; height: 50px; width: 300px; text-align:center; display: table; #position: relative; overflow: hidden; ">
<div style="#position: absolute; _top: 50%; _left: 50%; display: table-cell; vertical-align: middle;">
<div style="#position: relative; #top: -50%; left:-50%;">
Inner Text
</div>
</div>
</div>
|
mofo 01-16-2007, 11:24 pm
What reason do you have for centering your text verticle?
|
jwalker 01-17-2007, 08:45 am
Just various places in the page layout. Really, I'm just trying to improve my skills, and this particular issue seemed especially annoying.
|
| |
| Sexual Asspussy | This is awesome.
This is the first pornsite I've found in years that I'd actually advertise to swarmers. When you first load it up, it looks just like every crappy scam site out there, except that it's real. It's huge, it's updated constantly, there's no spam, no popups, and no bullshit -- and it's completely free. When you sign up through that link above and respond to the confirmation email, I make a bit of loose change.
See what other swarmers have to say about it. People love this place, so I feel fine about sending you there and am confident you will enjoy boners.
|
|
| My God, It's Full of Azron |
|
|
|