Skip to content

Instantly share code, notes, and snippets.

@RinatValiullov

RinatValiullov/resp3cols.html

Last active February 22, 2018 13:40
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save RinatValiullov/450a00e18a9fd889316954d421aeb6b5 to your computer and use it in GitHub Desktop.
Save RinatValiullov/450a00e18a9fd889316954d421aeb6b5 to your computer and use it in GitHub Desktop.
Download ZIP
Three responsive columns layout with css(not complete...)
Raw
resp3cols.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Responsive layout(3 columns)</title>
</head>
<body>
<style>
body {
background-color: #adf;
margin: 0;
}
.cbox {
background-color: #f00;
list-style-type: none;
margin: auto;
padding-left: 0;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
max-width: 33.4%;
}
.lbox {
background: #129;
margin: 0;
padding-left: 0;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
width: 33.3%;
}
.rbox {
background-color: #ea0;
margin: 0;
padding-left: 0;
position: fixed;
top: 0;
bottom: 0;
right: 0;
width: 33.3%;
}
</style>
<ul class="lbox"></ul>
<ul class="cbox"></ul>
<ul class="rbox"></ul>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment