tag:help.rocksolidthemes.com,2012-07-23:/discussions/contao/21939-fehler-home-slider-image-slider-darstellung-auf-dem-iphone-sind-image-und-berschrift-1-2-untereinanderRockSolid Themes: Discussion 2017-08-07T12:52:56Ztag:help.rocksolidthemes.com,2012-07-23:Comment/431550182017-08-07T07:58:50Z2017-08-07T07:58:50ZFehler: Home Slider / Image Slider Darstellung auf dem iphone sind Image und Überschrift 1 + 2 untereinander<div><p>Produkt: Vision Contao<br>
Contao-Version: 3.5<br>
Browser und Browserversionen: edge, Chrome neueste, IOS 10.3.3</p>
<p>Auf PC + Tablet liegt die beiden Überschriften korrekt AUF dem Bild. Auf dem iPhone wird dies untereinander, also zuerst das Bildelement und dann die beiden Überschriften. Wie bekomme ich die übereinander?<br>
Außerdem ist der Text auf dem iPhone viel zu groß.<br>
Was muß ich tun, um das entsprechend anzupassen?</p></div>Karl-Ludwig Groschtag:help.rocksolidthemes.com,2012-07-23:Comment/431550182017-08-07T09:30:40Z2017-08-07T09:30:40ZFehler: Home Slider / Image Slider Darstellung auf dem iphone sind Image und Überschrift 1 + 2 untereinander<div><p>Vielen Dank für Ihre Frage.</p>
<p>Der Text wird auf kleinen Bildschirmen unter dem Bild angezeigt, damit kein Text abgeschnitten werden muss und der Inhalt des Bildes besser sichtbar wird.</p>
<p>Sie können die Positionierung und die Textgröße verändern indem Sie folgenden CSS-Code in die Datei <em>files/vision/css/custom.css</em> einfügen:</p>
<pre>
<code>@media screen and (max-width: 599px) {
.main-image-hgroup,
.main-image.-large > .main-image-hgroup {
position: absolute;
top: auto;
bottom: 0;
}
.main-image-hgroup h2,
.main-image.-large > .main-image-hgroup h2 {
font-size: 24px;
}
.main-image-hgroup h3,
.main-image.-large > .main-image-hgroup h3 {
font-size: 14px;
}
}</code>
</pre></div>RockSolid Themestag:help.rocksolidthemes.com,2012-07-23:Comment/431550182017-08-07T10:34:33Z2017-08-07T12:49:36ZFehler: Home Slider / Image Slider Darstellung auf dem iphone sind Image und Überschrift 1 + 2 untereinander<div><p>Herzlichen Dank für Ihre schnelle Antwort.</p>
<p>Habe den Code entsprechend eingebaut, auf der Startseite ändern sich<br>
dadurch nichts, auf den Seiten der Produkt-Kategorien werden die Bilder<br>
abgeschnitten.<br>
Was hab ich falsch gemacht?</p></div>Karl-Ludwig Groschtag:help.rocksolidthemes.com,2012-07-23:Comment/431550182017-08-07T12:52:56Z2017-08-07T12:52:56ZFehler: Home Slider / Image Slider Darstellung auf dem iphone sind Image und Überschrift 1 + 2 untereinander<div><p>Anscheinend hat Ihr Text-Editor zusätzliche Zeichen in die CSS-Datei eingefügt die den Code fehlerhaft macht, der CSS-Code sieht aktuell folgendermaßen auf Ihrer Website aus:</p>
<pre>
<code>@media screen and (max-width: 599px) {
.main-image-hgroup,
 .main-image.-large > .main-image-hgroup {
position: absolute;
top: auto;
bottom: 0;
}
 .main-image-hgroup h2,
 .main-image.-large > .main-image-hgroup h2 {
font-size: 14px;
}
.main-image-hgroup h3,
 .main-image.-large > .main-image-hgroup h3 {
font-size: 12px;
}
}</code>
</pre>
<p>Durch die zusätzlichen<code>Â</code>-Zeichen wird der CSS-Code nicht richtig vom Browser verarbeitet. Bitte entfernen Sie diese Sonderzeichen und speichern Sie die Datei als UTF-8 (ohne BOM).</p></div>RockSolid Themes