/ / Wepchnij i pociągnij w Fundamentowej siatce - zurb-foundation, zurb-foundation-5

Wepchnij i pociągnij w Fundamentową siatkę - zurb-foundation, zurb-foundation-5

Potrzebuję układu w fundamencie, który na poziomie średnim i wyższym jest:

[8][4A]
[4B]

A na małych:

[4A]
[8]
[4B]

Jestem blisko osiągnięcia tego, ale kiedy mam dużo treści w moim 8 bloku, 4B jest przesuwane w dół strony, potrzebuję go do witryny poniżej 4A

Tutaj jest kodepen

Odpowiedzi:

0 dla odpowiedzi № 1

Czy możesz układać je w stosy w tej kolejności, czy też będzie to powodować konflikty z szablonem? Wydaje się naprawić lukę

<div class="row text-center">
<div class="small-12 columns medium-4 medium-push-8 ">
<div class="panel">        4A</div>
<div class="panel">        4B</div>
</div>

<div class="small-12 medium-8 medium-pull-4 columns">
<div class="panel">
<p>Content</p>
<p>Content</p>
<p>Content</p>
</div>
</div>

Jeśli chcesz 4b być poniżej column medium-8 następnie dodaj .clearfix po tym

  <div class="small-12 medium-8 medium-pull-4 columns">
<div class="panel">
<p>Content</p>
<p>Content</p>
</div>
</div>

<div class="clearfix"></div> // here clear floating position

<div class="small-12 columns medium-4 medium ">
<div class="panel">4A</div>
</div>