Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <div class = "container">
- <div class = "fixed">
- I'm 150px wide! Glee is awesome!
- </div>
- <div class = "fluid">
- I'm fluid! Glee is awesome!
- </div>
- <div class = "fixed">
- I'm 150px wide! Glee is awesome!
- </div>
- </div>
- html, body {
- height: 100%;
- }
- .container {
- display: table;
- width: 100%;
- height: 100%;
- }
- .container > div {
- display: table-cell;
- }
- .fixed {
- width: 150px; /*or whatever you want*/
- }
- .fluid {
- /*yep, nothing*/
- }
- var thisWidth = ($(window).width()) - 220 - 140;
- $('.center').css("width", thisWidth);
- var left = $(".left").width();
- var right = $(".right").width();
- var main = $(".wrapper").width();
- var setwidth = main - right - left;
- $('.center').css("width", setwidth);
- <div class = "container">
- <div class = "fixed first">
- I'm the first fixed
- </div>
- <div class = "fluid">
- I'm fluid!
- </div>
- <div class = "fixed last">
- I'm the last fixed
- </div>
- </div>
-
- html, body {
- height: 100%;
- font-family: 'Arial', 'Helvetica', Sans-Serif;
- }
- .container {
- display: table;
- width: 100%;
- height: 100%;
- }
- .container > div {
- text-align: center;
- float:left;
- }
- .fixed {
- background: rgb(34, 177, 77);
- color: white;
- width:150px;
- position:relative;
- }
- .fluid {
- background: rgb(0, 162, 232);
- float:left;
- width:100%;
- margin-left:-150px;
- margin-right:-150px;
- }
-
Add Comment
Please, Sign In to add comment