对齐 div 元素（css、html）

Question

I'm a beginner when it comes to HTML and CSS and I'm struggling to position some div elements as described in the image intended outcome . I've centered the table with margin-left: auto and margin-right: auto . I want the text div-element to be aligned right above the table. Is there any good way to do that?

Any help is much appreciated.

Answer 1

Put them both in another div that will be centered inside the box

Set the table width and the div width.

<div id="wrapper-div" style="margin:auto; width:XXpx">
    <div id="text-div" style=""></div>
    <div id="table-div"></div>
</div>

The wrapper div should have the same width as the table div.

Answer 2

有很多方法可以做到这一点，当您尝试时，您可以尝试添加以下 css 样式：

 display:inline-block