html - Being Flexbox element as flexbox container too -
// excuse beginner's english
hello! can implement follow construction:
<div class="flex-container-1"> <div class="flex-element-1 flex-container-2"> <div class="flex-element-2">...</div> <div class="flex-element-2">...</div> </div> <div class="flex-element-1 flex-container-2"> <div class="flex-element-2">...</div> <div class="flex-element-2">...</div> </div> </div>
my simple attempt:
.flex-container-1, .flex-container-2 { display: flex; } .flex-element-1, .flex-element-2 { flex: auto; }
... not correct.
making more flatten not way me, because need grouping container.
have ideas?
thanks!
i don't know want do, in example use display: flex
on container. flex box has more possibilities, , can read them here: http://css-tricks.com/snippets/css/a-guide-to-flexbox/
for example if use flex-direction: column
on flex-container-2
this:
.flex-container-1, .flex-container-2 { display: flex; } .flex-container-2 { flex-direction: column; } .flex-element-1, .flex-element-2 { flex: auto; }
<div class="flex-container-1"> <div class="flex-element-1 flex-container-2"> <div class="flex-element-2">1...</div> <div class="flex-element-2">1...</div> </div> <div class="flex-element-1 flex-container-2"> <div class="flex-element-2">2...</div> <div class="flex-element-2">2...</div> </div> </div>
Comments
Post a Comment