vertical-alignment

Bootstrap 3 / CSS: How to properly vertically align in panel heading

由 ╄→гoц情女王★ 提交于 2019-12-04 07:46:25
I use Bootstrap 3 to create panels with a structure like the below and would like to vertically align the span within the panel heading and without extending the default height of the panel heading. I tried different approaches (adding class="clearfix" , adding style="vertical-align:middle !important;" adding style="overflow:hidden !important;" etc.) but they are all either ignored or they increase the default height of the panel heading. My guess is that this is due to the "pull-right" class but as this is an official Bootstrap class I hope there is some workaround for this. Can someone tell

HTML-CSS overlay covering whole page with centered elements

由 不想你离开。 提交于 2019-12-04 06:53:47
问题 I want to create a simple full-screen overlay with loader and text in the center. I have some problems with the text. I want the image to be over ABOVE the text. Can you help me with this? <div id="loadingOverlay" class="loader-overlay"> <div class="loader-content loader-center"> <img src="http://www.mysarkarinaukri.com/images/loadingBar.gif" class="loader-center" alt=""/> <div class="loader-center loader-text">Loading, please wait...</div> </div> </div> http://jsfiddle.net/bLz7wgvs/2/ [edit]

How to Vertically center images and text in CSS

由 房东的猫 提交于 2019-12-04 05:29:06
问题 I have this fiddle here and i want to vertically center the text in the header, the picture in the footer and the picture in the middle which is sticked to the header... I don'T know how to achieve this and i already tried out some things but to no avail. I'll hope for your help here SO (= Link to the jsfiddle: http://jsfiddle.net/xF6xV/2/ HTML: <body> <div id="header"> <h1>Test Text but it's not inside the actual div...</h1> </div> <div id="content"> <div id="topcontent"> <img src="http:/

SpriteKit: Is there a way to centre a SKLabelNode according to its baseline

由 别等时光非礼了梦想. 提交于 2019-12-04 04:52:31
问题 A label has four different verticalAlignmentMode : .Baseline , .Bottom , .Center and .Top . I would like the label to be centred on its position according to its baseline. .Center doesn't work for me because the bottom of the frame isn't the baseline of the text, but rather, the bottom of the lowest letter (like a 'y', for example). I have also tried using .Baseline and subtracting half the frame's height from the y-position, but this doesn't work either and results in the same problem as

Vertical text in a Horizontal UIButton

由 …衆ロ難τιáo~ 提交于 2019-12-04 04:46:20
问题 I'm using a vertical UIButton in a portrait app (Just a normal button that is of width 60 and Height 160) I want to put the label Vetically down the button instead of across it. When I use the following code to rotate the label [workPackageButton.titleLabel setTransform:CGAffineTransformMakeRotation(M_PI / 2)]; It rotates the label but the length seems to be constrained by the original width, so I get the ... abreviation in the middle. Is there an easy way round this? 回答1: You can add a Label

How to remove space at top of <p> tag / align contained text to top of container?

由 大兔子大兔子 提交于 2019-12-04 04:34:15
问题 This is undoubtedly a stupid question but i'm having a bad day and it's confusing me! If you view http://jsfiddle.net/E6kGP/1/ then you can see 2 simple divs next to each other each of which contains a p tag each with different font sizes and matching line-heights. There is a small gap between the top of the p container and the top of the contained text which is different depending on the font sizes (and line-heights). This means that the top of the text in each p is not vertically aligned.

text-align center in <li> element

由 痴心易碎 提交于 2019-12-04 02:35:45
body { margin: 0; } .header { width: 80%; height: 20%; margin-left: 10%; position: fixed; top: 0; box-sizing: border-box; border-style: solid; border-width: 1px; background-color: green; } .image { width: 20%; height: 100%; float: left; box-sizing: border-box; border-style: solid; border-width: 1px; } .navigation { width: 79%; height: 100%; float: right; text-align: right; box-sizing: border-box; border-style: solid; border-width: 1px; } ul { height: 100%; font-size: 0; box-sizing: border-box; border-style: solid; border-width: 1px; background-color: yellow; } li { height: 100%; font-size:

Vertically center align a div within anothe div

由 百般思念 提交于 2019-12-04 02:31:17
问题 say i have <div id ="outer" class="outer"> <div id= "inner" class="inner"> //some stuff </div> </div> the inner div has a dynamic height, it changes depending on what is inside the div. the outer div is just a container which is set to have the height of the window. I want to set it so that the inner div is vertically centered within the outer div. Is there a way to do this easily in CSS or is JavaScript necessary? THE SOLUTION I FOUND: var container= document.getElementById("outer"); var

Vertically centering text inside flexbox item

由 六月ゝ 毕业季﹏ 提交于 2019-12-04 01:40:09
I want the flex items to take full height, but the content inside them to be vertically centred. justify-content: centre doesn't work, and align-self: centre on the item itself shrinks its height to its own content, while I want all items to be the same height. In this example I want the numbers to be vertically centred: http://codepen.io/ilyador/pen/ogYbWO?editors=110 .flex-container { padding: 0; margin: 0; list-style: none; display: flex; } .flex-item { flex: 1 1; background: tomato; padding: 5px; margin-top: 10px; color: white; font-weight: bold; font-size: 3em; text-align: center; border:

How to align Facebook and Tweet buttons?

由 亡梦爱人 提交于 2019-12-03 23:35:31
问题 The Facebook and Tweet buttons on our home page are vertically misaligned, and we're confused why. We can top align the two buttons if we use Firebug and remove the height for the Tweet button. However, the height is set dynamically, and inlined, from a Twitter script. We can't seem to override the height value. Here's the home page: http://www.panabee.com Are we doing something wrong in the CSS? Or is there a parameter we need to set in the Tweet button to override the height value? Our only
订阅 vertical-alignment