PSD-Tutorials.de
Forum für Design, Fotografie & Bildbearbeitung
Tutkit
Agentur
Hilfe
Kontakt
Start
Forum
Aktuelles
Besonderer Inhalt
Foren durchsuchen
Tutorials
News
Anmelden
Kostenlos registrieren
Aktuelles
Suche
Suche
Nur Titel durchsuchen
Von:
Menü
Anmelden
Kostenlos registrieren
App installieren
Installieren
JavaScript ist deaktiviert. Für eine bessere Darstellung aktiviere bitte JavaScript in deinem Browser, bevor du fortfährst.
Du verwendest einen veralteten Browser. Es ist möglich, dass diese oder andere Websites nicht korrekt angezeigt werden.
Du solltest ein Upgrade durchführen oder einen
alternativen Browser
verwenden.
Antworten auf deine Fragen:
Neues Thema erstellen
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
Webdesign: HTML/CSS, Responsive Design, Sass...
Safari macht riesige Zeilenumbrüche in meiner Site!?!
Beitrag
<blockquote data-quote="Tease" data-source="post: 1182944" data-attributes="member: 179934"><p><strong>AW: Safari macht riesige Zeilenumbrüche in meiner Site!?!</strong></p><p></p><p>Zuerst mal Danke für eure Tips.</p><p>Leider war allerdings bis jetzt noch nicht die Lösung für mein Problem dabei, aber vielleicht könnt ihr mich ja weiterhin unterstützen. Mit eurer Hilfe wird das was, da bin ich mir sicher. <img src="/styles/default/xenforo/smilies/zwinker.gif" class="smilie" loading="lazy" alt=";)" title="Wink ;)" data-shortname=";)" /></p><p></p><p>Ich habe mal eine Screenshot gemacht, der verdeutlichen soll, wo genau das Problem liegt, denn wenn man das immer umschreiben muss, verwirrt man die Leute meistens noch mehr.</p><p></p><p>A / B Vergleich Firefox / Safari: </p><p></p><p>Das Problem scheint eindeutig zu sein, dass Safari am Beginn und am Ende eines Absatzes eine zusätzliche Leerzeile reinschreibt. Die Frage ist nun halt, wieso und wie kann ich das abstellen? </p><p></p><p>Den html-Code habe ich oben bereits gepostet, aber hier nochmal kurz, damit niemand groß scrollen muss: </p><p></p><p><span style="font-size: 10px"><em><div id="inhalt"></em></span></p><p> <span style="font-size: 10px"><em><h2><span class="mpp">media powerplant</span> <span class="bereich">Videoproduktion</span></h2></em></span></p><p><span style="font-size: 10px"><em> <h2 class="unterüberschrift">Zeigen Sie was Sie können!</h2></em></span></p><p><span style="font-size: 10px"><em> <div id="haupthintergrundvideo"></em></span></p><p><span style="font-size: 10px"><em> <div id="fließtextvideo"></em></span></p><p><span style="font-size: 10px"><em><p>Nutzen sie Webvideos als günstige und effektive Möglichkeit ihr Unternehmen einer großen Öffentlichkeit zu präsentieren. <br></em></span></p><p><span style="font-size: 10px"><em>Nutzen Sie diese zeitgemäßen Marketingsinstrumente um schneller und direkter ihre künftigen Kunden und Partnern anzusprechen.</p></em></span></p><p><span style="font-size: 10px"><em> <p>&nbsp;</p></em></span></p><p><span style="font-size: 10px"></span> </p><p>Nun auch noch der dazugehörige css-Code:</p><p></p><p><em><span style="font-size: 10px">#inhalt {</span></em></p><p><em><span style="font-size: 10px"> float: left;</span></em></p><p><em><span style="font-size: 10px"> width: 750px;</span></em></p><p><em><span style="font-size: 10px"> height: 665px;</span></em></p><p><em><span style="font-size: 10px"> margin-top: 15px;</span></em></p><p><em><span style="font-size: 10px"> color: #D5D6EB;</span></em></p><p><em><span style="font-size: 10px"> font-size: 10px;</span></em></p><p><em><span style="font-size: 10px"> text-align: left;</span></em></p><p><em><span style="font-size: 10px"> margin-left: 30px;</span></em></p><p><em><span style="font-size: 10px">}</span></em></p><p><em><span style="font-size: 10px">h2 {</span></em></p><p><em><span style="font-size: 10px"> font-size: 14px;</span></em></p><p><em><span style="font-size: 10px">}</span></em></p><p><em><span style="font-size: 10px">.mpp {</span></em></p><p><em><span style="font-size: 10px"> font-size: 18px;</span></em></p><p><em><span style="font-size: 10px"> color: #C3DDE6;</span></em></p><p><em><span style="font-size: 10px"> font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;</span></em></p><p><em><span style="font-size: 10px"> font-weight: bold;</span></em></p><p><em><span style="font-size: 10px">}</span></em></p><p><em><span style="font-size: 10px">.bereich {</span></em></p><p><em><span style="font-size: 10px"> font-size: 18px;</span></em></p><p><em><span style="font-size: 10px"> color: #113F5D;</span></em></p><p><em><span style="font-size: 10px"> font-weight: 400;</span></em></p><p><em><span style="font-size: 10px">}</span></em></p><p><em><span style="font-size: 10px">.unterüberschrift {</span></em></p><p><em><span style="font-size: 10px"> font-size: 14px;</span></em></p><p><em><span style="font-size: 10px"> color: #114266;</span></em></p><p><em><span style="font-size: 10px"> font-weight: normal;</span></em></p><p><em><span style="font-size: 10px"> padding-top: 2px;</span></em></p><p><em><span style="font-size: 10px">}</span></em></p><p><em><span style="font-size: 10px">#haupthintergrund {</span></em></p><p><em><span style="font-size: 10px"> width: 782px;</span></em></p><p><em><span style="font-size: 10px"> height: 360px;</span></em></p><p><em><span style="font-size: 10px"> background-image: url(Bilder/texthintergrund.jpg);</span></em></p><p><em><span style="font-size: 10px"> background-repeat: repeat;</span></em></p><p><em><span style="font-size: 10px"> color: #092D43;</span></em></p><p><em><span style="font-size: 10px"> border: 2px solid #FFF;</span></em></p><p><em><span style="font-size: 10px"> margin-top: 10px;</span></em></p><p><em><span style="font-size: 10px"> padding-left: 5px;</span></em></p><p><em><span style="font-size: 10px"> padding-right: 5px;</span></em></p><p><em><span style="font-size: 10px">}</span></em></p><p><em><span style="font-size: 10px">#fließtextvideo {</span></em></p><p><em><span style="font-size: 10px"> background-color: #E5E4E4;</span></em></p><p><em><span style="font-size: 10px"> height: 135px;</span></em></p><p><em><span style="font-size: 10px"> width: 770px;</span></em></p><p><em><span style="font-size: 10px"> border: 1px solid #fff;</span></em></p><p><em><span style="font-size: 10px"> padding: 5px;</span></em></p><p><em><span style="font-size: 10px"> margin-top: 5px;</span></em></p><p><em><span style="font-size: 10px"> margin-bottom: 5px;</span></em></p><p><em><span style="font-size: 10px"> background-image: url(Bilder/texttotal.jpg);</span></em></p><p><em><span style="font-size: 10px"> background-repeat: repeat-x;</span></em></p><p><em><span style="font-size: 10px"> font-size: 12px;</span></em></p><p><em><span style="font-size: 10px">}</span></em></p><p><em><span style="font-size: 10px">p {</span></em></p><p><em><span style="font-size: 10px"> font-size: 12px;</span></em></p><p><em><span style="font-size: 10px"> color: #092D43;</span></em></p><p><em><span style="font-size: 10px">}</span></em></p><p></p><p>Das Inhalt Div liegt in:</p><p><span style="font-size: 10px"><em></em></span></p><p><span style="font-size: 10px"><em>#mitte {</em></span></p><p><span style="font-size: 10px"><em> float: left;</em></span></p><p><span style="font-size: 10px"><em> width: 900px;</em></span></p><p><span style="font-size: 10px"><em> background-image: url(Bilder/mppDesignNeu.jpg);</em></span></p><p><span style="font-size: 10px"><em> margin-top: 1px;</em></span></p><p><span style="font-size: 10px"><em> height: 806px;</em></span></p><p><span style="font-size: 10px"><em> background-position: 1px;</em></span></p><p><span style="font-size: 10px"><em> padding-left: 70px;</em></span></p><p><span style="font-size: 10px"><em>}</em></span></p><p><span style="font-size: 10px"><em>#hauptfenster {</em></span></p><p><span style="font-size: 10px"><em> width: 1024px;</em></span></p><p><span style="font-size: 10px"><em> margin-right: auto;</em></span></p><p><span style="font-size: 10px"><em> margin-left: auto;</em></span></p><p><span style="font-size: 10px"><em>}</em></span></p><p><span style="font-size: 10px"><em></em></span></p><p><span style="font-size: 10px"><em></em><span style="font-size: 10px">Komme alleine leider gerade überhaupt nicht mehr weiter und wäre euch echt dankbar, wenn ihr mir mit Rat zur Seite stehen würdet.</span></span></p><p><span style="font-size: 10px"><span style="font-size: 10px"></span></span></p><p><span style="font-size: 10px"><span style="font-size: 10px">Vielen Dank und schönes Wochenende noch!</span></span></p><p><span style="font-size: 10px"><span style="font-size: 10px">Tease</span></span></p></blockquote><p></p>
[QUOTE="Tease, post: 1182944, member: 179934"] [b]AW: Safari macht riesige Zeilenumbrüche in meiner Site!?![/b] Zuerst mal Danke für eure Tips. Leider war allerdings bis jetzt noch nicht die Lösung für mein Problem dabei, aber vielleicht könnt ihr mich ja weiterhin unterstützen. Mit eurer Hilfe wird das was, da bin ich mir sicher. ;) Ich habe mal eine Screenshot gemacht, der verdeutlichen soll, wo genau das Problem liegt, denn wenn man das immer umschreiben muss, verwirrt man die Leute meistens noch mehr. A / B Vergleich Firefox / Safari: Das Problem scheint eindeutig zu sein, dass Safari am Beginn und am Ende eines Absatzes eine zusätzliche Leerzeile reinschreibt. Die Frage ist nun halt, wieso und wie kann ich das abstellen? Den html-Code habe ich oben bereits gepostet, aber hier nochmal kurz, damit niemand groß scrollen muss: [SIZE=2][I]<div id="inhalt"> <h2><span class="mpp">media powerplant</span> <span class="bereich">Videoproduktion</span></h2> <h2 class="unterüberschrift">Zeigen Sie was Sie können!</h2> <div id="haupthintergrundvideo"> <div id="fließtextvideo"> <p>Nutzen sie Webvideos als günstige und effektive Möglichkeit ihr Unternehmen einer großen Öffentlichkeit zu präsentieren. <br> Nutzen Sie diese zeitgemäßen Marketingsinstrumente um schneller und direkter ihre künftigen Kunden und Partnern anzusprechen.</p> <p> </p>[/I] [/SIZE] Nun auch noch der dazugehörige css-Code: [I][SIZE=2]#inhalt { float: left; width: 750px; height: 665px; margin-top: 15px; color: #D5D6EB; font-size: 10px; text-align: left; margin-left: 30px; } h2 { font-size: 14px; } .mpp { font-size: 18px; color: #C3DDE6; font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; font-weight: bold; } .bereich { font-size: 18px; color: #113F5D; font-weight: 400; } .unterüberschrift { font-size: 14px; color: #114266; font-weight: normal; padding-top: 2px; } #haupthintergrund { width: 782px; height: 360px; background-image: url(Bilder/texthintergrund.jpg); background-repeat: repeat; color: #092D43; border: 2px solid #FFF; margin-top: 10px; padding-left: 5px; padding-right: 5px; } #fließtextvideo { background-color: #E5E4E4; height: 135px; width: 770px; border: 1px solid #fff; padding: 5px; margin-top: 5px; margin-bottom: 5px; background-image: url(Bilder/texttotal.jpg); background-repeat: repeat-x; font-size: 12px; } p { font-size: 12px; color: #092D43; }[/SIZE][/I] Das Inhalt Div liegt in: [SIZE=2][I] #mitte { float: left; width: 900px; background-image: url(Bilder/mppDesignNeu.jpg); margin-top: 1px; height: 806px; background-position: 1px; padding-left: 70px; } #hauptfenster { width: 1024px; margin-right: auto; margin-left: auto; } [/I][SIZE=2]Komme alleine leider gerade überhaupt nicht mehr weiter und wäre euch echt dankbar, wenn ihr mir mit Rat zur Seite stehen würdet. Vielen Dank und schönes Wochenende noch! Tease[/SIZE][/SIZE] [/QUOTE]
Bilder bitte
hier hochladen
und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Zitate einfügen…
Authentifizierung
Wenn ▲ = 5, ▼ = 2 und ■ = 7, was ist ▲ × ▼ + ■?
Antworten
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
Webdesign: HTML/CSS, Responsive Design, Sass...
Safari macht riesige Zeilenumbrüche in meiner Site!?!
Oben