Home>

Good day!

Please tell me what are the options for centering rubber in the height of the block. Block width 100px, altitude by content.

Interested in options on pure CSS, without using JS.

Let's start with a simple. What browsers?

koza4ok2021-03-30 05:04:01
  • Answer # 1
    Margin: 0 AUTO;
    

    But only if the block does not specify Float. If he is still asked, then the blame block in another DIV and exhibit it width and margin

    If Cho, it is a centering horizontally. Margin: Top Right Bottom Left;

    lampa2021-03-30 05:04:01

    @RedmonKey, it is necessary to make a vertical centering, and not horizontally. And the unit must be rubber in height. PS. Read the question.

    Astor2021-03-30 05:04:01

    then put the Diva Display: Table-Cell; Vertical-Align: Middle; Otherwise, without tables no=) PS. on the question it is not clear that the centering is needed by vertical

    RedMonkey2021-03-30 05:04:01

    @RedmonKey What is not clear in the expression "at the height of the block"?

    lampa2021-03-30 05:04:01

    a question the answer. If the rubber block for weight it does not mean that it needs to be centered vertically

    RedMonkey2021-03-30 05:04:01
  • Answer # 2

    http://cssing.org.ua/2007/04/26/another-css-valign-method/

    I have not yet checked (no time) ... Do these links correspond to the question, namely: the height block is rubber?

    Astor2021-03-30 05:04:01

    @ Koza4ok, checked. Does not match. Are there any other options?

    Astor2021-03-30 05:04:01
  • Answer # 3

    As option: Wrive down the block into the HEIGHT= WIDTH table= 100%:

    <
    Table width= 100% Height= 100% >
       ≪
    TR >
          ≪
    TD Valign= 'center' style= 'vertical-align: center;' >
             ≪
    DIV Class= 'Container' >
    ≪
    /div >
          ≪
    /TD >
       ≪
    /TR >
    ≪
    /Table >
    

    No, you are interested in the option without using tables.

    Astor2021-03-30 05:04:01

    And if tables, but not tables? :) jsfiddle.net/g66wd.

    Cypher2021-03-30 05:04:01