Matthias Apsel: bessere Lösung fürs Archiv (2-spaltig in 2-spaltig)

Beitrag lesen

Om nah hoo pez nyeetz, Linuchs!

Ich drucke auch auf A4 hoch zweispaltig, allerdings muss ich das dem Drucker extra sagen:

@media (min-width: 50em) {

nav ul {
    -moz-column-count: 2;
    -webkit-column-count: 2;
    column-count: 2;
    -moz-column-gap: 1.5em;
    -webkit-column-gap: 1.5em;
    column-gap: 1.5em;
  }
}
@media print {
  nav ul {
    -moz-column-count: 2;
    -webkit-column-count: 2;
    column-count: 2;
    -moz-column-gap: 1.5em;
    -webkit-column-gap: 1.5em;
    column-gap: 1.5em;
  }
}


>   
> Hatte mich gewundert, dass @media offenbar nur für den Bildschirm gilt. Denkfehler. Ich habe zwar die Breite der Anzeige begrenzt, sodass Display und Papier recht gut übereinstimmen. Aber die Angabe (min-width: 50em) gilt ja für die Gesamtbreite des Displays. Deshalb hat es unwissend geklappt ;-)  
  
@media gilt grundsätzlich für alle Medientypen, wenn nicht ausdrücklich etwas anderes festgelegt ist. Offensichtlich ist das A4-Papier nicht mindestens 50em breit.  
  
Auch eine Doppelung des CSS-Codes sollte nicht notwendig sein. Bei mir funktioniert  
~~~css
@media (min-width: 50em), print {  
   …  
}

problemlos.

Siehe auch [wiki/MQ](http://wiki.selfhtml.org/wiki/CSS/Media Queries)

Matthias

--
Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Quad und Quadflieg.