Martin_Online: dt - dd Liste Probleme || Vielleicht auch eine Frage an @MrMurph

Beitrag lesen

SELF-Forum

dt - dd Liste Probleme || Vielleicht auch eine Frage an @MrMurph

Martin_Online
– Informationen zu den Bewertungsregeln

So langsam habe ich das Gefühl, dass ich mit meinen dt – dd Listen auf einem falschen Weg bin. Mein Code sieht derzeit wie folgt aus:

  
      <dl class="multicolumn">  
  
         <dt>Link 1:</dt>  
         <dd><?php echo $l1;?></dd>  
  
         <dt>Link 2:</dt>  
         <dd><?php echo $l2;?></dd>  
  
         <dt>Link 3:</dt>  
         <dd><?php echo $l3;?> </dd>  
  
         <dt>Link 4:</dt>  
         <dd><?php echo $l4;?> </dd>  
  
         <dt>Link 5:</dt>  
         <dd><?php echo $l5;?></dd>  
  
         <dt>Link 6:</dt>  
         <dd><?php echo $l6;?></dd>  
  
         <dt>Link 7:</dt>  
         <dd><?php echo $l7;?></dd>  
  
         <dt>Link 8:</dt>  
         <dd><?php echo $l8;?> </dd>  
  
         <dt>Link 9:</dt>  
         <dd><?php echo $l9;?> </dd>  
  
         <dt>Link 10:</dt>  
         <dd><?php echo $l10;?></dd>  
  
      </dl>

Mit einem if prüfe ich, ob mein User etwas ausgefüllt hat

  
		<?php if (strlen($l10) > 0): ?>  
         <dt>Link 10:</dt>  
         <dd><?php echo $l10;?></dd>  
		<?php endif;?>

Funktioniert alles ohne Problem, auch wird alles schön angezeigt. Sobald aber ein Feld _nicht_ ausgefüllt ist, werden alle Eintrage untereinander dargestellt, sonst sind immer zwei Einträge in einer Reihe. Ich hatte erwartet, dass der Platz einfach durch den darauf folgenden Eintrag genommen wird.

Mein CSS Code sieht so aus

  
   dt {  
      width: 40%;  
      float: left;  
      padding: 0 0 8px 0;  
      margin: 0;  
   }  
   dd {  
      width: 60%;  
      float: left;  
      padding: 0 0 8px 0;  
      margin: 0;  
  
   /* Multicolumn */  
   .multicolumn {  
      -moz-column-count: 2;  
      -moz-column-gap: 30px;  
      -webkit-column-count: 2;  
      -webkit-column-gap: 30px;  
      column-count: 2;  
      column-gap: 30px;  
   }  
   .multicolumn h1 {  
      padding: 0;  
      margin: 0 0 1rem 0;  
      border-bottom: 2px solid black;  
   }  
   .multicolumn h2 {  
      padding: 0;  
      margin: 0 0 1rem 0;  
      break-inside: avoid;  
   }  
   .multicolumn p {  
      padding: 0;  
      margin: 0 0 1rem 0;  
      text-align: justify;  
      break-inside: avoid;  
   }  
   .ueberallespalten {  
      -webkit-column-span: all;  
      column-span: all;  
   }

Dieser Code habe ich auf dieser Seite gefunden http://foreninfo.bplaced.net/seiten_fremdprobleme/. Daher vielleicht auch eine Frage an MrMurphy da von ihm der Code kommt.

Beitrag melden
–
Informationen zu den Bewertungsregeln