Skip to content

Instantly share code, notes, and snippets.

@dlukes dlukes/stretchy_div.html
Last active Feb 3, 2016

Embed
What would you like to do?
A stretchy div between other divs on one line.
<!-- How to have a div stretch between divs on the left and right. Useful e.g. for -->
<!-- Bootstrap navbar et al. -->
<style>
.inner-navbar {
border: 2px solid black;
padding: 5px;
width: 100%;
}
.left {
float: left;
}
.red{
border: 2px solid red;
}
.green{
border: 2px solid green;
}
.blue{
border: 2px solid blue;
}
.right{
float: right;
}
</style>
<div class="inner-navbar">
<div class="red left">Red</div>
<div class="green left">green</div>
<div class="green right">green</div>
<!-- this last div is the one that won't float and will be stretched -->
<div class="blue">blue</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.