Heim > Web-Frontend > CSS-Tutorial > Wie kann man in CSS dafür sorgen, dass jedes Element die gleiche Breite wie das breiteste Element hat?

Wie kann man in CSS dafür sorgen, dass jedes Element die gleiche Breite wie das breiteste Element hat?

Susan Sarandon
Freigeben: 2024-11-28 17:10:12
Original
571 Leute haben es durchsucht

How to Make Every Item the Same Width as the Widest Element in CSS?

So stellen Sie sicher, dass jedes Element die gleiche Breite wie das breiteste Element hat

In diesem Layout wird jedes Element so gestreckt, dass es die Breite des breitesten Elements einnimmt Element, auch in Szenarien, in denen das Element in mehrere Zeilen umgebrochen wird. Um diesen Effekt mit CSS zu erzielen:

<div>


 display: inline-flex;<br> flex -direction: row;<br> justify-content: center;<br>}</p><p>.list {<br> display: flex;<br> Flex-Richtung: Spalte;<br>}</p><p>.list-item {<br> Text-Transform: Großschreibung;<br> Hintergrundfarbe: RGB(200, 30, 40) ;<br> Schriftgröße: 1,3em;<br> Textausrichtung: links;<br> Polsterung: 10px;<br> margin: 1px;<br> display: flex;<br> flex-direction: row;<br> flex-wrap: wrap;<br> justify-content: flex-start;<br>}&lt ;/pre><br><pre class="brush:php;toolbar:false"><p><div> <div class="list"></p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><div>
Nach dem Login kopieren
Nach dem Login kopieren



<div>
<div>
Nach dem Login kopieren
Nach dem Login kopieren


Das obige ist der detaillierte Inhalt vonWie kann man in CSS dafür sorgen, dass jedes Element die gleiche Breite wie das breiteste Element hat?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Vorheriger Artikel:Wie füge ich in Twitter Bootstrap eine Fußzeile an das Ende der Seite ein? Nächster Artikel:Wie kann ich einen Glasscheibeneffekt mit unscharfen Überlagerungen in allen Browsern erstellen?
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Aktuelle Ausgaben
verwandte Themen
Mehr>
Beliebte Empfehlungen
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage