Skip to content

Instantly share code, notes, and snippets.

@pera

pera/pseudo-fluid.html

Last active December 11, 2015 12:19
Show Gist options
  • Save pera/4600283 to your computer and use it in GitHub Desktop.
Save pera/4600283 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
pseudo-fluid.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title>Pseudo-fluid</title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
.pepe {
background-color:yellow;
width: 100%;
min-width: 1000px;
height: 400px;
overflow-x: hidden;
}
.foo {
margin: 0 -1000px;
}
.wrapper {
background-color:violet;
width: 3000px;
height: 300px;
margin: 0 auto;
}
.wrapper>div {
float: left;
}
.left {
background-color: red;
width:1000px;
height:200px;
}
.center {
background-color: green;
width:1000px;
height:200px;
text-align: center;
}
.right {
background-color: blue;
width:1000px;
height:200px;
}
</style>
</head>
<body>
<div class="pepe">
<div class="foo">
<div class="wrapper">
<div class="left"></div>
<div class="center"><div><p>pseudo-fluid layout</p></div></div>
<div class="right"></div>
</div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment