Ich habe Probleme, meine Thumbnails korrekt in meinem Umbraco-Projekt zu verhalten.Thumbnails, die CSS nicht in Umbraco übertragen 7
Ich verwende eine for-Schleife, um die Thumbnails aus einem Multiple-Media-Picker-Eigenschafteneditor anzuzeigen.
<ul class="hide-bullets">
@for (var i = 0; i < images.Count; i++)
{
<li class="">
<a class="thumbnail" id="[email protected]"><img class="thumbnail-img" src='@images[i].Url'></a>
</li>
}
</ul>
Meine ursprüngliche Vorlage verwendet nur statische Bilder:
<ul class="hide-bullets">
<li class="">
<a class="thumbnail" id="carousel-selector-0"><img class="thumbnail-img" src="images/sommerhuse/ebeltoft/1.jpg"></a>
</li>
<li class="">
<a class="thumbnail" id="carousel-selector-1"><img class="thumbnail-img" src="images/sommerhuse/ebeltoft/2.jpg"></a>
</li>
<li class="">
<a class="thumbnail" id="carousel-selector-2"><img class="thumbnail-img" src="images/sommerhuse/ebeltoft/3.jpg"></a>
</li>
</ul>
Ich habe genau die gleichen CSS-Dateien in jedem Projekt enthalten sind, aber sie sind anders auf der Seite angezeigt.
Dies ist, wie sie in meiner ursprünglichen Vorlage aussehen: http://i.imgur.com/WokI5GP.png
Und das ist, wie sie in meinem Umbraco Projekt aussehen: http://i.imgur.com/LbZaDS9.png
Die „thumnail-img“ Klasse, die zu Bildern hinzugefügt wird, funktioniert nur 2 sachen:
.thumbnail-img {
width: 100% !important;
height: 100% !important;
}
Beide Projekte enthalten Bilder mit unterschiedlichen Auflösungen.
Was könnte die Ursache dafür sein? Umbraco überschreibt meine Stile, oder ändert der Medienwähler, wie die Bilder angezeigt werden?
Kann das Statikbildbeispiel unterschiedliche Auflösung aber gleiche Höhe haben? . Ist es in Ordnung, Breite und Höhe an eine bestimmte Bildgröße anzupassen? – cjmling
Eines der statischen Bilder hat eine andere Höhe, ist aber horizontal mit den anderen Bildern ausgerichtet. Das Fixieren der Breite und Höhe könnte vielleicht funktionieren. – Leth
versuchen,% zu px ändern und sehen, ob es was Sie wollen? Bsp .: Breite: 100px; Höhe: 100px; oder du könntest Breite: 100%; Höhe: 100px; – cjmling