/ / Wydrukuj dwie kolumny w css przy pomocy Zurb Foundation 4 - css, printing, sass, zurb-foundation

Wydrukuj dwie kolumny w css przy pomocy Zurb Foundation 4 - css, printing, sass, zurb-foundation

Mój kod wygląda następująco:

<link rel="stylesheet" href="css/foundation.css" media="all">
<div class="row">
<div class="large-12 columns">
<div class="large-6 column">
Lorem ipsum
</div>
<div class="large-6 column">
Lorem ipsum
</div>
</div>
</div>

w przeglądarce wygląda tak, jak powinno Przeglądarka

Ale kiedy chcę go wydrukować - działa jak widok mobilny / tablet wprowadź opis obrazu tutaj

Muszę mieć dokładnie dwie widoczne kolumny na stronie DIN A4, a także w przeglądarce. Czy istnieje sposób, aby sobie z tym poradzić? Lub nawet lepsze ramy niż Zurb.Foundation 4 dla tego problemu?

Z poważaniem.

Odpowiedzi:

0 dla odpowiedzi № 1

W przypadku telefonów komórkowych należy dodać klasy small-12 do pojemnika (tj. gdzie masz large-12) i small-6 do miejsca, w którym się znajdujesz large-6. Do wydruku sugeruję dodanie np. zwyczaj print-6 klasa o szerokości 50% i odpowiednio pływająca.


-1 dla odpowiedzi № 2

Jeśli kiedykolwiek masz ten problem. Wypróbuj Bootstrap, ponieważ nie ma jeszcze prawdziwego rozwiązania w Fundacji. Przynajmniej mnie nie znalazłem.

Bootstrap:

<div class="row">
<div class="col-6 col-sm-6 col-lg-6">
Lorem ipsum
</div>
<div class="col-6 col-sm-6 col-lg-6">
Lorem ipsum
</div>
</div>