Get Even More Visitors To Your Blog, Upgrade To A Business Listing >>

How to push up text in CSS?

How to push up text in CSS?

Problem

Demo: http://jsfiddle.net/DerekL/gNkKx/

I am trying to Push up the text in a div by 50%, and I tried

padding-bottom: 50px; /*div is 100px high*/

But it does not work.

padding-top: -50px;

This does not work too. Any work-around?

Problem Courtesy of: Derek 朕會功夫

Solution

line-height:0px; pushes it up some, but I don't know how much and it's apparently not 50px as you want.

You can wrap the element in another container and position it like so:

HTML

CSS (only showing modifications from your style)

.container{
    position: relative;
}
.block {
  position: absolute;
  top: -50px;
}

DEMO

Solution courtesy of: sachleen

Discussion

View additional discussion.



This post first appeared on CSS3 Recipes - The Solution To All Your Style Problems, please read the originial post: here

Share the post

How to push up text in CSS?

×

Subscribe to Css3 Recipes - The Solution To All Your Style Problems

Get updates delivered right to your inbox!

Thank you for your subscription

×