Questions tagged [vertical-alignment]

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

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; }
small img 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…
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

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
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…
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
228
votes
11 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
  • 8,232
  • 4
  • 43
  • 79
1
2 3
99 100