Bild aufgeteilt in Tabelle: Entfernen Raum zwischen den Reihen

Vielleicht ist die Lösung ist einfach, aber ich habe nichts gefunden, das meine Frage noch beantwortet ...Bild aufgeteilt in Tabelle: Entfernen Raum zwischen den Reihen

Ich möchte ein Bild in mehrere aufgeteilt, so kann ich es clic oder schweben Sie es und erstellen Sie coole Interaktionen auf etwas, das wie ein einzelnes Bild aussieht. Problem, mein Bild hat einen unerwünschten Abstand zwischen den Zeilen der Tabelle.

hier also genau das, was ich zu tun bedeuten:

<div id="blocfour"> 
 
    <table border="0" cellspacing="0" cellpadding="0"> 
 
     <tr> 
 
     <td><img src="http://cuisines-et-bains.com/wp-content/uploads/2016/07/step2.png" /></td> 
 
     <td><img src="http://cuisines-et-bains.com/wp-content/uploads/2016/07/step3.png" /></td> 
 
     </tr> 
 
     <tr> 
 
     <td><img src="http://cuisines-et-bains.com/wp-content/uploads/2016/07/step1.png"/></td> 
 
     <td><img src="http://cuisines-et-bains.com/wp-content/uploads/2016/07/step4.png" /></td> 
 
     </tr> 
 
    </table> 
 
</div>

Ich habe versucht, "Zusammenbruch" in CSS und andere zahlreiche Dinge, aber naaah, der verdammte Raum ist hier nach wie vor - oder vielleicht habe ich es falsch gemacht. Irgendeine Idee, wie ich es loswerden kann?

Quelle

2016-07-08 GaletteRaclette

Mögliches Duplikat [Wie unerwünschten Raum zwischen den Zeilen zu entfernen und Spalten in der Tabelle?] (http://stackoverflow.com/questions/2279 396/how-to-remove-unerwünschte-Leerzeichen-zwischen-Zeilen-und-Spalten-in-Tabelle entfernen) – DavidDomain

Sie können das Problem beheben, indem img ‚s Layouts block Wechsel:

td img{display:block}

<div id="blocfour"> 
 
    <table border="0" cellspacing="0" cellpadding="0"> 
 
     <tr> 
 
     <td><img src="http://cuisines-et-bains.com/wp-content/uploads/2016/07/step2.png" /></td> 
 
     <td><img src="http://cuisines-et-bains.com/wp-content/uploads/2016/07/step3.png" /></td> 
 
     </tr> 
 
     <tr> 
 
     <td><img src="http://cuisines-et-bains.com/wp-content/uploads/2016/07/step1.png"/></td> 
 
     <td><img src="http://cuisines-et-bains.com/wp-content/uploads/2016/07/step4.png" /></td> 
 
     </tr> 
 
    </table> 
 
</div>

Quelle

2016-07-08 13:34:18 potashin

Danke für Ihre Antwort. Ich habe es auf meiner Website versucht, aber es sieht so aus, als ob mein Problem nicht so einfach ist. Das Wordpress Theme enthält bereits so viele CSS, es hilft nicht ...: S Hier ist der Link, wo ich versuche (und zu kämpfen), um dies einzurichten: http://cuisines-et-bains.com/script-test/ Irgendeine Idee, was ich tun sollte? – GaletteRaclette

@GaletteRaclette: Sie können es mit '! Wichtig' verwenden, um Wordpress-Stylings neu zu schreiben. – potashin

Ow ja! Das hat funktioniert :) Also habe ich gerade diese Zeile zu meinem CSS hinzugefügt: td img { \t display: block! Wichtig; } Vielen Dank. – GaletteRaclette

Wenn Sie Text in der Tabelle verwenden, können Sie font-size für Tabellenzellen in CSS zurücksetzen.

table { 
 
    font-size: 0; 
 
}

<div id="blocfour"> 
 
    <table border="0" cellspacing="0" cellpadding="0"> 
 
    <tr> 
 
     <td> 
 
     <img src="http://cuisines-et-bains.com/wp-content/uploads/2016/07/step2.png" /> 
 
     </td> 
 
     <td> 
 
     <img src="http://cuisines-et-bains.com/wp-content/uploads/2016/07/step3.png" /> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
     <img src="http://cuisines-et-bains.com/wp-content/uploads/2016/07/step1.png" /> 
 
     </td> 
 
     <td> 
 
     <img src="http://cuisines-et-bains.com/wp-content/uploads/2016/07/step4.png" /> 
 
     </td> 
 
    </tr> 
 
    </table> 
 
</div>

Quelle

2016-07-08 13:34:08 makshh

Bild aufgeteilt in Tabelle: Entfernen Raum zwischen den Reihen

Antwort

Verwandte Themen