2016-06-13 3 views
0

Ich habe unerwünschte Polsterung auf der linken Seite der Bilder (siehe Code unten). Ich habe versucht, jede Codezeile im CSS .wrapper-shadow zu ändern, zu löschen oder zu ersetzen - kein Glück. Dieser Fehler wird in Firefox, Chrome und Explorer angezeigt. Interessanterweise habe ich sehr ähnlichen Code für Tablet und mobile Seiten für die gleiche Website, die den Fehler nicht haben. Ich habe versucht, das Tablet CSS und HTML für den Desktop-Code zu ersetzen und der Fehler tauchte trotzdem auf. See attached image of the problem.Unerwünschte Auffüllung des linken Rands der Bilder mit CSS-Wrapper

Auch interessant: Die Tabletts und mobilen Websites (die korrekt angezeigt) haben schmalere linke Ränder als die Desktop-Website. . Ich habe jede Zeile meines benutzerdefinierten Bootstrap-CSS durchsucht, um zu sehen, ob ich einen Unterschied zwischen den Desktop- und Tablet-Stylesheets finden konnte - wieder kein Glück. Jede Hilfe wird sehr geschätzt. Vielen Dank. Zaffer

.wrapper_shadow{ 
 
\t max-width: 765px; 
 
\t background-color: #9ebade; 
 
\t border: thin solid #758fa9; 
 
\t -webkit-box-shadow: 2px 2px 5px 2px #758fa9; 
 
\t box-shadow: 2px 2px 5px 2px #758fa9; 
 
\t margin-bottom: 15px; 
 
\t padding-left: 0px; \t 
 
}
<div class="container-fluid"> 
 
    <div class="pageHeaderText">Virtual performance art made with Unity3D game creation software</div> 
 
    <div class="row"> 
 
    <div class="col-sm-6"> 
 
     <div class="wrapper_shadow center-block"> 
 
     <img src="images/ColorCubed_765.jpg" class="img-responsive center-block" alt="ColorCubed"/> 
 
     </div>

+0

Was ist die 'img-responsive Zentrum-block' Regeln halten/aussehen? – LGSon

+0

@LGSon http://getbootstrap.com/css/#images-responsive – hjpotter92

Antwort

0

Ich habe gerade die Antwort selbst. Es ist wundervoll, wenn man über eine Frage nachdenkt, die ausreicht, um sie zu veröffentlichen. Manchmal erscheint die Antwort ein paar Minuten später in deinem Gehirn.

Ich hatte die Zeile: "padding-left: 5px;" im * {} Stil meines Elternteils bootstrap.css, der herunterkippte und den Fehler in meiner styles.css verursachte. (Siehe Code unten). Die Tatsache, dass der Fehler nur in der Desktop-Version meiner Website auftrat und nicht auf dem Tablet oder Handy, die eigene Stylesheets haben, war der Schlüssel. Ich denke, die Moral der Geschichte besteht immer darin, deine Kaskaden zu überprüfen. Vielen Dank. Zaffer

* { 
 
\t -webkit-box-sizing: border-box; 
 
\t -moz-box-sizing: border-box; 
 
\t box-sizing: border-box; 
 
\t padding-left: 5px; 
 
}

Verwandte Themen