CSS - How to align content to middle using bootstrap?


Tags: css,twitter-bootstrap,css3,twitter-bootstrap-3

Problem :

I'm experiencing some issues while i'm trying to put <span> content aligned to middle:

enter image description here

I'm using bootstrap and i want to align middle the price value or No price found. Ask price.

Demo: https://jsfiddle.net/3erhxr1j/



Solution :

See the updated fiddle: https://jsfiddle.net/3erhxr1j/2/ By adding equal height and line height to the wrapping div, you can then center what's inside with vertical align.

.text-center.col-xs-12.col-sm-3{
   height: 120px;
   line-height: 120px;
}

h3{
    display: inline-block;
    vertical-align: middle;
    line-height: normal;
}

    CSS Howto..

    How to include LESS files in web page using Web Essentials?

    Asp.Net how to apply a css style to all the control of it's kind

    CSS help, how to target this link inside of div

    How do you control CSS styles from within the CMS interface in Zotonic?

    How to add custom CSS/JS to Grails 2.4.x layouts/templates?

    How to make CSS compatible with all browsers?

    How to Align text with respect to image css

    Pure JavaScript - how to add class to a class? Or change style in class

    How can I center vertically a div with position absolute and hight = 100px on another div with position relative but with not standard height

    How to create a full screen div on landing page

    How to nest multiple css attributes inside another attribute

    How to make the content div scrollable without using javascript

    How can I vertically align the text in an anchor tag?

    How is “:after” element's height and width determined? [closed]

    How to combine transforms in CSS?

    How do I keep a fixed header on top if there's a small strip on top of it?

    how to hidden image over image in css

    How to Paginate Footnotes Properly in CSS & HTML (Print Media)

    how to make nested flexboxes work

    How to properly use CSS borders to visualize a value chain?

    How does this CSS produce a circle?

    How to create CSS dropdown

    CSS Column Help: How do I get a column within a column?

    CSS: How to refer to a tag

    Codeigniter shows views differently when index is removed

    How to create a pulsing glow ring animation in CSS?

    How to make a glyphicon work as a submit button?

    CSS - How to apply box-shadow to a image rounded

    How to create CSS styled dom element inside Google Maps InfoWindow?

    How to make a 2x2 grid of Div's in CSS?