/ / So entfernen Sie den horizontalen Abstand zwischen Bildern in einer Tabelle - Leerzeichen

So entfernen Sie den horizontalen Abstand zwischen Bildern in einer Tabelle - Leerzeichen

Bevor ich die Bilder in der Tabelle mit Bildergalerien verknüpft habe, gab es keine Leerzeichen zwischen den Bildern. Ich konnte die vertikalen Zwischenräume mit entfernen font-size:0; aber ich kann scheinbar keinen Weg finden, die horizontalen Räume zu entfernen.

`

    <div class="center">
<table id="Table_01" width="960" height="603" border="0" cellpadding="0" cellspacing="0">
<tr><!--
--><td><ul class="gallery clearfix"></ul><!--
--> <div class="c1"><!--
--> <ul class="gallery clearfix"><!--
-->     <a href="img/photos/c1/c_1.jpg" rel="prettyPhoto [ch1]"><img src="/images/img/maison/maison_01.png" width="644" height="253" alt=""></a><!--
--> </ul><!--
--> </div>
<div class="c1">
<ul class="gallery clearfix">
<a href="img/photos/c1/c_2.jpg" rel="prettyPhoto [ch1]"></a>
</ul>
</div>
<div class="c1">
<ul class="gallery clearfix">
<a href="img/photos/c1/c_3.jpg" rel="prettyPhoto [ch1]"></a>
</ul>
</div>
<div class="c1">
<ul class="gallery clearfix">
<a href="img/photos/c1/s_1.jpg" rel="prettyPhoto [ch1]"></a>
</ul>
</div>
<div class="c1">
<ul class="gallery clearfix">
<a href="img/photos/c1/s_2.jpg" rel="prettyPhoto [ch1]"></a>
</ul>
</div>
</td><!--
--><td><!--
--> <div class="c2"><!--
--> <ul class="gallery clearfix"><!--
-->     <a href="img/photos/c2/c_1.jpg" rel="prettyPhoto [ch2]"><img src="/images/img/maison/maison_02.png" width="316" height="253" alt=""></a><!--
--> </ul><!--
--> </div>
<div class="c2">
<ul class="gallery clearfix">
<a href="img/photos/c2/c_2.jpg" rel="prettyPhoto [ch2]"></a>
</ul>
</div>
<div class="c2">
<ul class="gallery clearfix">
<a href="img/photos/c2/c_3.jpg" rel="prettyPhoto [ch2]"></a>
</ul>
</div>
<div class="c2">
<ul class="gallery clearfix">
<a href="img/photos/c2/c_4.jpg" rel="prettyPhoto [ch2]"></a>
</ul>
</div>
</td><!--
--></tr><!--
--><tr><!--
--> <td><!--
--> <div class="bu"><!--
--> <ul class="gallery clearfix"><!--
-->     <a href="img/photos/bu/bu_1.jpg" rel="prettyPhoto [bu1]"><img src="/images/img/maison/maison_03.png" width="644" height="121" alt=""></a><!--
--> </ul><!--
--> </div><!--
--> </td><!--
--><td rowspan="2">
<div class="sal">
<ul class="gallery clearfix">
<a href="img/photos/sal/b_1.jpg" rel="prettyPhoto [sal]"><img src="/images/img/maison/maison_04.png" width="316" height="350" alt=""></a>
</ul>
</div>
<div class="sal">
<ul class="gallery clearfix">
<a href="img/photos/sal/b_2.jpg" rel="prettyPhoto [sal]"></a>
</ul>
</div>
<div class="sal">
<ul class="gallery clearfix">
<a href="img/photos/sal/b_3.jpg" rel="prettyPhoto [sal]"></a>
</ul>
</div>
</td><!--
--></tr><!--
--><tr><!--
--><td><!--
--> <div class="sej"><!--
--> <ul class="gallery clearfix"><!--
-->     <a href="img/photos/sej/s_1.jpg" rel="prettyPhoto [sej]"><img src="/images/img/maison/maison_05.png" width="644" height="229" alt=""></a><!--
--> </ul><!--
--> </div>
<div class="sej">
<ul class="gallery clearfix">
<a href="img/photos/sej/s_2.jpg" rel="prettyPhoto [sej]"></a>
</ul>
</div>
<div class="sej">
<ul class="gallery clearfix">
<a href="img/photos/sej/s_3.jpg" rel="prettyPhoto [sej]"></a>
</ul>
</div>
<div class="sej">
<ul class="gallery clearfix">
<a href="img/photos/sej/s_4.jpg" rel="prettyPhoto [sej]"></a>
</ul>
</div>
</td>
</tr><!--
--> </table>
</div>

</div>

<!-- PrettyPhoto SCRIPT -->
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
$("area[rel^="prettyPhoto"]").prettyPhoto();

$(".gallery:first a[rel^="prettyPhoto"]").prettyPhoto({animation_speed:"normal",slideshow:3000, autoplay_slideshow: false});
$(".gallery:gt(0) a[rel^="prettyPhoto"]").prettyPhoto({animation_speed:"fast",slideshow:10000, hideflash: true});

$("#custom_content a[rel^="prettyPhoto"]:first").prettyPhoto({
custom_markup: "<div id="map_canvas" style="width:260px; height:265px"></div>",
changepicturecallback: function(){ initialize(); }
});

$("#custom_content a[rel^="prettyPhoto"]:last").prettyPhoto({
custom_markup: "<div id="bsap_1259344" class="bsarocks bsap_d49a0984d0f377271ccbf01a33f2b6d6"></div><div id="bsap_1237859" class="bsarocks bsap_d49a0984d0f377271ccbf01a33f2b6d6" style="height:260px"></div><div id="bsap_1251710" class="bsarocks bsap_d49a0984d0f377271ccbf01a33f2b6d6"></div>",
changepicturecallback: function(){ _bsap.exec(); }
});
});
</script>

CSS:

.center {display: block;font-size: 0;max-width:1100px;margin-top: -30px;margin-left:auto;margin-right:auto;}

Ergebnis: http://www.simoncokes.ovh/mais.html

Entschuldigung für das Durcheinander, ich bin nur ein Anfänger / Neuling / Anfänger!

Antworten:

1 für die Antwort № 1

Versuche dies:

td, th {
border: 0px;
padding: 0px;
}

tr {
border: 0px;
padding: 0px;
margin: 0px;
}

img {
display: block;
}

Stellen Sie auch die Tabelle mit diesen Attributen ein:

cellspacing = "0"  cellpadding = "0"

Es sollte funktionieren