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 hide the border of tag (when the img load error)

    how to set equal font size in table cells for mobile device html pages

    How to apply the CSS of navbar-inverse in twitter-bootstrap

    How to underline list items separately with CSS?

    How to show Bootstrap 3 popover scroll only when needed

    How to make sure that two divs appear side by side? [closed]

    using the unorthodox `head {display: block}` to show text to user?

    How to create dropdown navigationbar without float?

    How to make the contents of a div not wrap?

    How to select all cell starting, containing or ending with some word with JQuery/CSS?

    How to switch css table-cell from left to right?

    How to force Dojo TitlePane to overlap with CSS?

    how to use CSS positioning in 100% width layout

    How do I make a hamburger menu display on the right side?

    How to add custom CSS for displaying on mobile screens in WordPress?

    css: how to target p a img

    How to blur one side of the div using CSS

    How to make a better transition of

    How should I change css style of fixed element to not crossing scrollbar

    CSS: How to make selectable boxes?

    How to include SASS files and CSS files into version repository and developement cycle

    How to put JavaScript from tutorial into my website?

    Show different forms using buttons with animation

    how to float the section tags in html5

    how to make background 100% on a top menu

    how to deselect a css style using javascript?

    Hover over a pre - how to highlight a single line with plain CSS?

    How to keep div visible when hovering another div

    How to add the same header and footer to all pages at once? HTML

    How the browser identifies the CSS framework? [closed]