[closed] [meta] CSS fix

Das CSS der Seite (style.css) beinhaltet derzeit

.answer-body img {
    max-width: 640px;
}
.question-body img {
    max-width: 640px;
}

Leider ist jedoch das HTML kaputt, sodass die Fragen und Antworten gar nicht in den entsprechenden Containern sind. Das ist auch der Grund dafür warum große Bilder immer über den Rand hinauslaufen.

Ich bin mir nicht sicher aber ich glaube, dass der folgende CSS-Selektor das beheben sollte.

.main-body img {
    max-width: 640px;
}

Prinzipiell würde es vermutlich auch das allgemeinere

img {
    max-width: 100%;
}

tun. In der Regel will man ja nicht, dass Bilder über ihren Parent-div rausschauen.

Workaround

Solange es für dieses Problem keinen offiziellen Fix gibt, kann man sich so behelfen.

Nach dem Upload sollte das Bild so eingebunden sein:

[![alt text][1]][1]

  [1]: http://texwelt.de/wissen/upfiles/test.png

Dies ersetzt man dann durch (den alt text habe ich weggelassen, weil ich den eh nie benutze)

[<img src="http://texwelt.de/wissen/upfiles/test.png" style="max-width:100%;"/>][1]

  [1]: http://texwelt.de/wissen/upfiles/test.png

meta bilder

Dieser Frage ist "Community Wiki" markiert.

gefragt 15 Dez '17, 01:51

Henri
15.7k●13●39●43
Akzeptiert-Rate: 46%

bearbeitet 16 Jan '20, 16:05

stefan ♦♦
18.3k●16●31●48

Danke! Hast Du evtl. einen Link, wo es noch übergroß ist? Oder es sich reproduzieren lässt? Im Sandkasten klappte es mit übergroßer PNG ohne Änderung des CSS.

(16 Dez '17, 16:03) stefan ♦♦

@stefan http://texwelt.de/wissen/fragen/18061 Das Problem ist, dass der Container question-body nach dem Code-Block aufhört (was er nicht sollte) und deshalb für das Bild darunter kein max-width gesetzt ist. In diesem Fall ist es etwas subtil, da das Bild 700px breit ist, wodurch man den Unterschied zu 640px nicht so gut erkennt.

(17 Dez '17, 02:32) Henri

@stefan Kannst du vielleicht einfach mal eine der vorgeschlagenen Lösungen in style.css eintragen? Das wäre wirklich eine bedeutende Verbesserung. Ich weiß, das ist nicht optimal, aber immer noch besser als überall kaputte Bilder.

(21 Feb '18, 09:10) Henri

Der zweite Workaround scheint zu klappen, im Sandkasten getestet. Den edit mit workarounds im Januar hab ich wohl nicht gesehen.

(25 Feb '18, 00:50) stefan ♦♦

Die Frage wurde aus folgenden Grund "Das Problem ist nicht reproduzierbar oder veraltet" geschlossen Henri 25 Feb '18, 01:48

Folgen dieser Frage

Per E-Mail:

Wenn sie sich anmelden, kommen Sie für alle Updates hier in Frage

Per RSS:

Antworten

Antworten und Kommentare

Markdown-Grundlagen

*kursiv* oder _kursiv_
**Fett** oder __Fett__
Link:[Text](http://url.com/ "Titel")
Bild?![alt Text](/path/img.jpg "Titel")
nummerierte Liste: 1. Foo 2. Bar
zum Hinzufügen ein Zeilenumbruchs fügen Sie einfach zwei Leerzeichen an die Stelle an der die neue Linie sein soll.
grundlegende HTML-Tags werden ebenfalls unterstützt

erfahre mehr über Markdown

Frage-Themen:

meta ×104
bilder ×33

gestellte Frage: 15 Dez '17, 01:51

Frage wurde gesehen: 2,947 Mal

zuletzt geändert: 25 Feb '18, 01:48

[closed] [meta] CSS fix

Workaround

Die Frage wurde aus folgenden Grund "Das Problem ist nicht reproduzierbar oder veraltet" geschlossen Henri 25 Feb '18, 01:48

Folgen dieser Frage

verwandte Fragen