Questions tagged [vertical-alignment]

Typically a style or other UI definition associated with the placement of an interface item in the vertical plane.

3043 questions
2446
votes
38 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
  • 30,374
  • 32
  • 106
  • 166
2080
votes
23 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; }
small img Doesn't work.
sam
  • 21,293
  • 3
  • 18
  • 14
1597
votes
36 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
  • 90,979
  • 22
  • 192
  • 188
1471
votes
46 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
  • 17,724
  • 7
  • 32
  • 54
1330
votes
32 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
  • 17,930
  • 21
  • 69
  • 98
1255
votes
28 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…
kristof
  • 49,335
  • 23
  • 82
  • 107
892
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
  • 14,323
  • 12
  • 56
  • 82
730
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
  • 13,241
  • 22
  • 76
  • 112
565
votes
30 answers

Best way to center a

Best way to center a
element on a page both vertically and horizontally? I know that margin-left: auto; margin-right: auto; will center on the horizontal, but what is the best way to do it vertically, too?
J-Dog
374
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…
251
votes
8 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,335
  • 2
  • 17
  • 17
242
votes
34 answers

Add centered text to the middle of a
-like line

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
  • 71,376
  • 65
  • 208
  • 328
241
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,059
  • 5
  • 21
  • 22
235
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
  • 53,999
  • 81
  • 200
  • 285
173
votes
9 answers

How to center div vertically inside of absolutely positioned parent div

I am trying to get blue container in the middle of pink one, however seems vertical-align: middle; doesn't do the job in that case.
Vladimirs
  • 7,364
  • 4
  • 37
  • 68
1
2 3
99 100