CSS: Center block, but align contents to the left

后端 未结 8 758
别那么骄傲
别那么骄傲 2020-11-30 19:27

I want a whole block to be centered in its parent, but I want the contents of the block to be left aligned.

Examples serve best

On this page :

http

相关标签:
8条回答
  • 2020-11-30 20:06

    If I understand you well, you need to use to center a container (or block)

    margin-left: auto;
    margin-right: auto;
    

    and to left align it's contents:

    text-align: left;
    
    0 讨论(0)
  • 2020-11-30 20:10

    First, create a parent div that centers its child content with text-align: center. Next, create a child div that uses display: inline-block to adapt to the width of its children and text-align: left to make the content it holds align to the left as desired.

    <div style="text-align: center;">
        <div style="display: inline-block; text-align: left;">
            Centered<br />
            Content<br />
            That<br />
            Is<br />
            Left<br />
            Aligned
        </div>
    </div>

    0 讨论(0)
提交回复
热议问题