Comment accueillir une division à largeur fixe et une division d'espace restant dans la conception Web ?

Accommoder les divs à largeur fixe et restants

Dans la conception Web, un défi courant consiste à accueillir deux divs, l'un ayant une largeur fixe spécifique et l'autre devant être dynamique. occupent l'espace restant.

Solution basée sur CSS

Une approche efficace utilise CSS :

.left {</p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">width: 83%;

Copier après la connexion

}

.right {

width: 16%;

}

Cette configuration CSS garantit que le div .left occupe 83 % de la largeur disponible, tandis que le div .right occupe les 16 % restants, préservant la largeur fixe souhaitée pour le div .left.

Affichage : méthode de table

Alternativement, la propriété display: table offre une solution puissante :

<div class="right"> </div><br><div class="left"></div>

.left {</p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">display: table-cell;
width: 83%;

Copier après la connexion