Wie können Ränder verwendet werden, damit ein Div den verbleibenden Raum zwischen anderen Divs ausfüllt?

Ränder verwenden, um den verbleibenden Platz auszufüllen

In Ihrem HTML haben Sie die Breiten von div1 und div3 festgelegt, aber nicht von div2. Dadurch bleibt eine unbekannte Menge an Platz zwischen der linken und rechten Spalte, wo sich div2 befinden sollte.

Damit div2 die verbleibende Breite ausfüllt, können Sie Ränder verwenden. So geht's:

#Main {
  width: 500px;
}

#div1 {
  width: 100px;
  float: left;
}

#div2 {
  margin-left: 100px;
  margin-right: 100px;
}

#div3 {
  width: 100px;
  float: right;
}

In diesem CSS:

• Die Breite von div2 wird nicht explizit festgelegt. Stattdessen werden der linke und der rechte Rand auf jeweils 100 Pixel festgelegt. Dadurch wird div2 gezwungen, den Platz zwischen div1 und div3 einzunehmen.
• Beachten Sie, dass div2 im HTML nach div3 platziert wird. Dadurch wird sichergestellt, dass div2 zwischen den Rändern von div1 und div3 positioniert wird, anstatt an das Ende des Containers verschoben zu werden.

Mit diesen CSS-Änderungen füllt div2 automatisch die verbleibende Breite innerhalb von #Main aus Behälter und achten Sie darauf, dass zwischen den drei Spalten keine leeren Lücken entstehen.

Das obige ist der detaillierte Inhalt vonWie können Ränder verwendet werden, damit ein Div den verbleibenden Raum zwischen anderen Divs ausfüllt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!