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
40
votes
10 answers

Vertically Centre Align Text in TextField Flutter

I tried finding in a lot of resources but unfortunately i could not find a way to align the text vertically centre in a textfield. I also tried using suffixIcon instead of suffix but still not luck. Here is my code : import…
39
votes
10 answers

How to vertically align Bootstrap v4 modal dialogs

Vertically center modal dialogues in Bootstrap 4. Note: The requirements below have been added to make it clear I am looking for a proper way to vertically center a Bootstrap modal, covering all possible cases, on all possible devices, in all…
tao
  • 82,996
  • 16
  • 114
  • 150
38
votes
4 answers

Vertical-align: bottom not working

I thought vertical-align was supposed to work with inline elements. Yet for some reason everything in the gray div is aligned to the top, not the bottom.
Adam Rackis
  • 82,527
  • 56
  • 270
  • 393
38
votes
4 answers

Vertically centering a title page

I'm trying to vertically center a title on a custom-sized page with latex. I've written the following code, but for some reason it doesn't center. Could someone please point me to what's wrong with it? Thanks!…
Clément
  • 12,299
  • 15
  • 75
  • 115
38
votes
4 answers

Vertically centering text within an inline-block

I'm trying to create some buttons for a website using styled hyperlinks. I have managed to get the button looking how I want, bar one slight issue. I can't get the text ('Link' in the source code below) to vertically center. Unfortunately there may…
Josh Bowe
  • 383
  • 1
  • 3
  • 4
38
votes
3 answers

How do I vertically align a div inside a table cell?

How do I vertically center a div that is inside a table cell? HTML:
Stuff
CSS: .rowClass { vertical-align:middle !important; …
John Anderson
  • 1,075
  • 5
  • 21
  • 25
36
votes
1 answer

Vertical Alignment of SVG in CSS

I have a problem with inline SVG alignment. I have created a button with some text and an SVG. And while the alignment works correctly when the SVG is at least as big as the text it fails when the SVG height is smaller than the text. I have created…
MyWetSocks
  • 592
  • 1
  • 4
  • 10
35
votes
4 answers

Vertical alignment of subfigures LATEX

I am working on my thesis and I am struggling with placing 2 images next to each other, so that the second image would be centered vertically along the first one. I was also trying to use subfigure instead of subfloat but neither of them works. This…
Veronika D
  • 1,031
  • 2
  • 11
  • 10
33
votes
3 answers

How to make a div align to the right side of the parent while maintaining its vertical position?

Please refer to this handy diagram I drew: div1's height is unknown. div3's width is fluid; it should never overlap div2. Both div1 and div2 have the same width and are horizontally centered via margin: auto. How can I position div3 so that it…
Stas Bichenko
  • 13,013
  • 8
  • 45
  • 83
30
votes
3 answers

Bootstrap Vertical Align Image

On this website: http://www.livenews.surf/ I want to make news images and text vertically middle align, how i can do that?
Gonçalo Loureiro
  • 349
  • 1
  • 3
  • 9
29
votes
5 answers

iOS 5.0 Safari not vertically centering placeholder in text box

I want to vertically center the text entered in input text boxes on the page. Typical way to achieve this is to set the line-height and height equal. This works on pre iOS 5.0 Safari. However; on iOS 5, Safari displays the typed text vertically…
Nirmal Patel
  • 5,128
  • 8
  • 41
  • 52
29
votes
4 answers

Vertical align an image and a multiline text

I´m trying to align an image and a text vertically: +-------------------------+ -- Viewport | Text text text | | +-----+ text text text | | |IMAGE| text text text | | +-----+ text text text | | text text text |…
bceo
  • 319
  • 1
  • 3
  • 5
29
votes
9 answers

Android Studio 0.8.2: Remove Vertical Line Break

Been searching through the editor settings for quite a while but I can't figure out how to turn off the vertical line break in Android Studios 0.8.2. Driving me crazy!!!
blee908
  • 12,165
  • 10
  • 34
  • 41
29
votes
7 answers

Vertical-align image

I have a div that contains an image and a p tag (seen below). I want to align the image in the middle of the div vertically depending on how many lines the paragraph is. Vertical-align doesn't work. I am using JavaScript right now to figure out how…
jakeprzespo
  • 333
  • 1
  • 4
  • 6
28
votes
5 answers

"vertical-align: middle" does not align to the middle in Firefox

I'm trying to align some text of different sizes vertically, however, Firefox displays the smaller text way above the middle. CSS: div.categoryLinks { margin: 1em 16px; padding: 0 4px; border-width: 1px 0; border-style: solid; …
DisgruntledGoat
  • 70,219
  • 68
  • 205
  • 290