Inline-Blockrand Ausgabe

Question

Ich habe 3 Divs in einer Reihe mit einem Bild und etwas Text. Ein Div hat einen kürzeren Text als der andere. Wenn ich die Größe des Browsers ändere und der Text nur in einem div in die neue Zeile eingeht (also ein div hat zwei Zeilen Text und die anderen nur eine Zeile), erhalten die divs mit weniger Textzeilen einen zusätzlichen Rand oben. Aber wenn ich das "inspect element" öffne, ist nichts falsch in den Zahlen.

das ist, was ich über

hier spricht die html:

<div id="ribolovna_mjesta" class="content ne_naslovna"> 


       <div class="drustvo_wrapper"> 
        <div class="inner"> 
         <img src="img/FOTF0A9.jpg" class="img-responsive"> 
         <h4>SRD "Karas" Peklenica </h4> 
        </div> 
       </div> 
       <div class="drustvo_wrapper"> 
        <div class="inner"> 
         <img src="img/FOTF0A9.jpg" class="img-responsive"> 
         <h4>SRD "Karas" Peklenica </h4> 
        </div> 
       </div> 
       <div class="drustvo_wrapper"> 
        <div class="inner"> 
         <img src="img/FOTF0A9.jpg" class="img-responsive"> 
         <h4>SRD "Diver" Podbrest i Sveti Križ </h4> 
        </div> 
       </div> 
       <div class="drustvo_wrapper"> 
        <div class="inner"> 
         <img src="img/FOTF0A9.jpg" class="img-responsive"> 
         <h4>SRD "Karas" Peklenica <br /> </h4> 
        </div> 
       </div> 
       <div class="drustvo_wrapper"> 
        <div class="inner"> 
         <img src="img/FOTF0A9.jpg" class="img-responsive"> 
         <h4>SRD "Karas" Peklenica </h4> 
        </div> 
       </div> 
       <div class="drustvo_wrapper"> 
        <div class="inner"> 
         <img src="img/FOTF0A9.jpg" class="img-responsive"> 
         <h4>SRD "Karas" Peklenica </h4> 
        </div> 
       </div> 

     </div> 

sass

#ribolovna_mjesta 
     text-align: center 
     width: 100% 


     .drustvo_wrapper 
      display: inline-block 
      width:30% 
      min-width: 125px 
      min-height: 205px 
      margin: 5px 


      .inner   
       padding: 10px 

versucht, den Raum zwischen den divs mit Kommentaren und negativen Margen zu entfernen und Wortabstand ... half nicht ... es gab mir das gleiche Ergebnis ..

was soll ich als nächstes versuchen?

Vielen Dank im Voraus

Answer 1

Hast du einen Blick auf Box-sizing property?

Ich denke, es kann sonst noch, aber ohne Code einbetten kann ich nicht