Oggi ho pubblicato un nuovo articolo e l’immagine nella sezione Anteprima presenta un overflow del bordo.
Quando si visualizza l’articolo pubblicato, l’immagine è parzialmente fuori dai margini e nascosta.
Gli articoli precedenti non presentano questo problema. Si tratta di un bug e come posso risolverlo?
Link: https://babyforex.net/t/xu-huong-thi-truong-forex-21-08-2019-gold-xau-usd-gbp-usd-aud-usd/169
Vediamo, questa è un’immagine da 1700 × 480 pixel:
Sembra tutto a posto. Hai sovrascritto il CSS sul tuo sito? Potrebbe essere quello a creare interferenze. Non riesco a riprodurre alcun problema con un’immagine larga.
Ho anche cliccato e non vedo alcun problema sul tuo sito, nemmeno con quell’argomento. Tutte le immagini sembrano a posto e non sono state ritagliate artificialmente.
Tieni presente che annidare le citazioni (o anche solo usare le citazioni) limita la larghezza del post, quindi potresti notare stranezze in questi casi.
Come in questo caso, immagina che si tratti di un’immagine
Non sono riuscito a trovare alcun problema. E devo sovrascrivere il CSS in Admin per risolvere.
Posso riprodurlo senza problemi, quindi non sono sicuro di cosa tu stia parlando. Vedi il post sopra con l’immagine larga.
Ho registrato un video con i dettagli: https://www.youtube.com/watch?v=3uRjtTzXj7o
Il video non aiuta, prova a riprodurlo qui su Meta. Aggiungi un’immagine larga alla tua prossima risposta.
Non vedo alcun problema nelle immagini sopra?
Significa che il mio forum ha un problema. Ma non ho trovato alcun errore. Ho provato a rimuovere tutti i plugin e i componenti del tema, ma non sono riuscito a risolvere questo errore.
Ora devo aggiungere questo CSS nel CSS personalizzato per risolvere il problema:
.d-editor-preview .image-wrapper img, .lightbox-wrapper img, .cooked img.d-lazyload {
width: 100%;
height: auto;
}
Ho provato a confrontare il CSS del mio sito con quello di Discourse.
Nel mio sito:
#reply-control .d-editor-preview img:not(.thumbnail), .cooked img:not(.thumbnail) {
max-width: 1200px;
max-height: 628px;
}
HTML:
<img src="https://babyforex.net/uploads/default/original/1X/10670fd0bf4b34154ae4447feff1fc93f5eaed7e.jpeg" alt="h%C3%ACnh%20%E1%BA%A3nh" data-base62-sha1="2l6rNxc3PYiacNMqRTIM4GcaAjA" width="1200" height="526" class="d-lazyload">
In Discourse:
#reply-control .d-editor-preview img:not(.thumbnail), .cooked img:not(.thumbnail) {
max-width: 690px;
max-height: 500px;
HTML:
<img src="https://d11a6trkgmumsb.cloudfront.net/optimized/3X/e/9/e98710650be7c014168330f7c60d7081340c89cb_2_690x194.jpeg" alt="image" data-base62-sha1="xjSCGCdDwgRqb1OJkiAZNgbEQEr" width="690" height="194" class="d-lazyload" srcset="https://d11a6trkgmumsb.cloudfront.net/optimized/3X/e/9/e98710650be7c014168330f7c60d7081340c89cb_2_690x194.jpeg, https://d11a6trkgmumsb.cloudfront.net/optimized/3X/e/9/e98710650be7c014168330f7c60d7081340c89cb_2_1035x291.jpeg 1.5x, https://d11a6trkgmumsb.cloudfront.net/optimized/3X/e/9/e98710650be7c014168330f7c60d7081340c89cb_2_1380x388.jpeg 2x">
In Discourse la larghezza è sempre 690px.
Nel mio sito invece è 1200px e le immagini risultano nascoste.
