div affiancati con larghezza variabile e fissa

**slerosa** · 16-01-2016, 11:25

Come da titolo devo riuscire a mettere la barra blu accanto a quella grigia,
quella grigia dovrà avere una larghezza fissa mentre la blu dovrà andare avere un margine sinistro di pochi pixel e andare a coprire la larghezza di tutta la pagina (responsive)... aiutino?

ho preparato questo https://jsfiddle.net/dhpjLrhh/

**lucavizzi** · 16-01-2016, 15:32

Originariamente inviata da SamT0

Ricorda che il totale della width di pagina è 100% quindi usa le dovute proporzioni per le barre, ad esempio .blu 20% e .line 80%

E' una buona approssimazione ma la barra grigia non avrebbe larghezza fissa

Propongo questa soluzione:

codice:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Fit width</title>
<style type="text/css">
.wrap, .gray, .blue{
 height:100px;
}
.wrap{
 position:relative;
}
.gray, .blue{
 position:absolute;
 top:0;
}
.gray{
 background:gray;
 width:170px;
 left:0;
}
.blue{
 background:blue;
 left:175px; /* 5px di margine sinistro */
 right:0; /* fa espandere il div */
}
</style>
</head><body>
<div class="wrap">
   <div class="gray">I'm fixed</div>
   <div class="blue">I fit the page</div>
</div>
</body>
</html>

Discussione: div affiancati con larghezza variabile e fissa

Strumenti discussione

Ricerca discussione

Visualizza

div affiancati con larghezza variabile e fissa

Permessi di invio