Divides side by side without floats or position: absolute

I am trying to find a way to place divs side by side without using float or position: absolute. Divas will have a given width and may have elements inside. This is for CMS, where the user will be able to drag and drop content items to organize them. They should not be divs, I just don’t know any other HTML tag that will work better.

Basically the end result for the CMS, in which the user can organize content items by dragging and dropping them. Unfortunately, with floats, if you want to do something that involves placing divs under each other, everything will be down below the highest div above it, even if it can fit under something else. those. 3 elements, 2 of which should be laid on the left, and the third on the right - with a height somewhere in between.

Inline-block is disabled because IE is not supported (although I would like to be a hook and just require a chrome frame ...) and in any case does not work for this purpose.

+3
source share
4 answers

, , , : ... , , , , ?

+2

, .. , ? , , , - , ul, ul . uls, , 1. ... .

+1

, , (position:absolute, display: inline-block float) - .

<table>
    <tr>
        <td><div id="div1">...content...</div></td>
        <td><div id="div2">...content...</div></td>
    </tr>
</table>

, :

<div id="container">
    <div id="div1">...content...</div>
    <div id="div2">...content...</div>
</div>

css:

#container {display: table; } /* you might need another child div with 'display: table-row' but I can't remember off-hand */
#div1 {display: table-cell; width: 50%; /* other css */}
#div2 {display: table-cell; /* width: 50%; other css */}

, , . . =/

0
0
source

Source: https://habr.com/ru/post/1753754/


All Articles