Typically a style or other UI definition associated with the placement of an interface item in the vertical plane.
Questions tagged [vertical-alignment]
3252 questions
2730
votes
37 answers
How do I vertically center text with CSS?
I have a
element which contains text and I want to align the contents of this
vertically center.
Here is my
style:
#box {
height: 170px;
width: 270px;
background: #000;
font-size: 48px;
color: #FFF;
text-align:…

Irakli Lekishvili
- 33,492
- 33
- 111
- 169
2236
votes
26 answers
Vertically align text next to an image?
Why won't vertical-align: middle work? And yet, vertical-align: top does work.
span{
vertical-align: middle;
}
Doesn't work.

sam
- 22,913
- 3
- 21
- 14
1723
votes
37 answers
How to vertically align an image inside a div
How can you align an image inside of a containing div?
Example
In my example, I need to vertically center the
in the
with class ="frame":


Arnaud Le Blanc
- 98,321
- 23
- 206
- 194
1646
votes
49 answers
How can I vertically center a div element for all browsers using CSS?
I want to center a div vertically with CSS. I don't want tables or JavaScript, but only pure CSS. I found some solutions, but all of them are missing Internet Explorer 6 support.
Div to be aligned vertically
How can I…
Burak Erdem
- 19,630
- 7
- 36
- 56
1555
votes
34 answers
How do I vertically align text in a div?
I am trying to find the most effective way to align text with a div. I have tried a few things and none seem to work.
.testimonialText {
position: absolute;
left: 15px;
top: 15px;
width: 150px;
height: 309px;
vertical-align:…

shinjuo
- 20,498
- 23
- 73
- 104
1429
votes
29 answers
How to align content of a div to the bottom
Say I have the following CSS and HTML code:
#header {
height: 150px;
}
The header section is fixed height, but the header content may change.
I…
Header title
Header content (one or multiple lines)
kristof
- 52,923
- 24
- 87
- 110
1049
votes
28 answers
How can I vertically align elements in a div?
I have a div with two images and an h1. All of them need to be vertically aligned within the div, next to each other. One of the images needs to be absolute positioned within the div.
What is the CSS needed for this to work on all common…

Abdu
- 16,129
- 13
- 59
- 84
788
votes
10 answers
Vertically align text within a div
The code below (also available as a demo on JS Fiddle) does not position the text in the middle, as I ideally would like it to. I cannot find any way to vertically centre text in a div, even using the margin-top attribute. How can I do this?

Cyclone
- 14,839
- 23
- 82
- 114
621
votes
30 answers
401
votes
10 answers
How to vertically center a container in Bootstrap?
I'm looking for a way to vertically center the container div inside the jumbotron and to set it in the middle of the page.
The .jumbotron has to be adapted to the full height and width of the screen. The .container div has a width of 1025px and…

user1012181
- 8,648
- 10
- 64
- 106
294
votes
33 answers
Add centered text to the middle of a horizontal rule
I'm wondering what options one has in xhtml 1.0 strict to create a line on both sides of text like-so:
Section one
----------------------- Next section -----------------------
Section two
I've thought of doing some fancy things like this:

Brian M. Hunt
- 81,008
- 74
- 230
- 343
288
votes
9 answers
How to set the margin or padding as percentage of height of parent container?
I had been racking my brains over creating a vertical alignment in css using the following
.base{
background-color:green;
width:200px;
height:200px;
overflow:auto;
position:relative;
}
.vert-align{
…

Ryan
- 3,715
- 2
- 20
- 17
265
votes
17 answers
Text vertical alignment in WPF TextBlock
How do I assign vertical center alignment to the text inside a TextBlock? I found TextAlignment property but it is for horizontal text alignment. How do I do it for vertical text alignment?

Ant
- 3,369
- 5
- 25
- 23
236
votes
7 answers
Android: Vertical alignment for multi line EditText (Text area)
I want to have 5 lines for the height of the text area. I am using the following code.

d-man
- 57,473
- 85
- 212
- 296