Das Ausgabefenster mit Überlauf verhält sich bei Rückenwind-CSS nicht wie erwartet
Posted: 06 Jan 2025, 18:36
Ich habe dieses erste Design mit meiner Raw-Ausgabe erhalten, das so aussieht:
Es nimmt genau wie beabsichtigt die gesamte Breite ein. Das Problem besteht darin, dass, wenn es Inhalte enthält und diese zu lang sind, das Design kaputt geht und zu lang wird:
[img]https:/ /i.sstatic.net/XIhC3qFc.png[/img]
Wie Sie sehen können, ist die Breite zu lang und zerstört das Design. Der Überlauf der Rohausgabe zerstört das Design. Das ist mein Code:
ScrapePage.tsx
RawOutput.tsx
Wenn ich overflow-auto auf das übergeordnete Div anwende, wird das Design in Bezug auf die Höhe nicht beeinträchtigt:
Aber in der Breite ist das Design kaputt:
< img alt="Bild des Containers mit gebrochenem Design unter Verwendung der Breite" src="https://i.sstatic.net/WSlDNGwX.png" />
Grundsätzlich ist mein Ziel nur, dass die Breite der Raw-Ausgabe mit der Bildschirmgröße festgelegt wird und wird Habe nur eine Schriftrolle, wenn sie zu lang ist. Ein perfektes Beispiel dafür ist das Design wie hier im Stackoverflow, wenn der gemeinsam genutzte Code zu lang ist:
[img]https://i.sstatic.net /HTRQJzOy.png[/img]
Es nimmt genau wie beabsichtigt die gesamte Breite ein. Das Problem besteht darin, dass, wenn es Inhalte enthält und diese zu lang sind, das Design kaputt geht und zu lang wird:
[img]https:/ /i.sstatic.net/XIhC3qFc.png[/img]
Wie Sie sehen können, ist die Breite zu lang und zerstört das Design. Der Überlauf der Rohausgabe zerstört das Design. Das ist mein Code:
ScrapePage.tsx
Code: Select all
[b]Raw Output[/b]
[b]Extract[/b]
Code: Select all
const RawOutput = ({ input }: Props) => {
return (
{input || 'No input provided'}
)
}
Aber in der Breite ist das Design kaputt:
< img alt="Bild des Containers mit gebrochenem Design unter Verwendung der Breite" src="https://i.sstatic.net/WSlDNGwX.png" />
Grundsätzlich ist mein Ziel nur, dass die Breite der Raw-Ausgabe mit der Bildschirmgröße festgelegt wird und wird Habe nur eine Schriftrolle, wenn sie zu lang ist. Ein perfektes Beispiel dafür ist das Design wie hier im Stackoverflow, wenn der gemeinsam genutzte Code zu lang ist:
[img]https://i.sstatic.net /HTRQJzOy.png[/img]