Login / Join
3 Floating divs, expand middle div width
submitted on 06/08/2014 by
Codicode
+ infos
Config
Embed
Share
3 Floating divs, expand middle div width
by
Codicode
placing 3 floating divs side by side design, and making the center div expand dynamically and max width to fill all the available space.
Framework 1 :
-- None --
jQuery 2.0.3
jQuery 1.9.1
jQuery 1.9.0
jQuery 1.8.0
jQuery 1.7.1
jQuery 1.6.3
jQuery UI 1.10.3
MooTools 1.4.5
AngularJS 1.0.4
Prototype 1.7.1.0
Dojo 1.8.3
Chrome Frame 1.0.3
Ext Core 3.1.0
SWFObject 2.2
WebFont Loader 1.1.2
Framework 2 :
-- None --
jQuery 2.0.3
jQuery 1.9.1
jQuery 1.9.0
jQuery 1.8.0
jQuery 1.7.1
jQuery 1.6.3
jQuery UI 1.10.3
MooTools 1.4.5
AngularJS 1.0.4
Prototype 1.7.1.0
Dojo 1.8.3
Chrome Frame 1.0.3
Ext Core 3.1.0
SWFObject 2.2
WebFont Loader 1.1.2
+ Js file(s) :
+ Css file(s) :
Apply
Link :
Direct http link :
Fork button :
Html code :
Embed preview :
Copy the following html code to your page to embed the preview,
To include many previews on a single page, just repeat the first line.
You can change the width, height and border color (bcolor).
<div class="refork-widget" code="246" style="width:100%;height:200px;" bcolor="#ccc"></div>
<script type="text/javascript" src="//snippet.run/d/z.js"></script>
HTML
<div class="left"> Left div </div> <div class="right"> Right div </div> <div class="center"> This is the centre div, this will expand to take the available space. </div>
CSS
.left{ width:100px; float:left; background-color:red; } .center{ padding:0px 100px; background-color:green; } .right{ width:100px; float:right; background-color:blue; }
Javascript
©2013 Copyright snippet.run
Privacy
-
Terms of use
-
About
-
Contact
