Skip to content

Instantly share code, notes, and snippets.

@t1089
Created May 2, 2018 01:49
Show Gist options
  • Select an option

  • Save t1089/36e080e6b419239ed76c2ae00e7aeaa5 to your computer and use it in GitHub Desktop.

Select an option

Save t1089/36e080e6b419239ed76c2ae00e7aeaa5 to your computer and use it in GitHub Desktop.
JS Bin // source http://jsbin.com/wimajog
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<style id="jsbin-css">
.relative {
position: relative;
width: 600px;
height: 400px;
background-color: yellow;
}
.absolute {
position: absolute;
top: 120px;
right: 0;
width: 300px;
height: 200px;
background-color: green;
}
.fixed {
position: fixed;
bottom: 20px;
right: 40px;
width: 200px;
color:white;
background-color: black;
}
</style>
</head>
<body>
aa
bb<br>cc<br>dd<br>
<div class="relative" style="width:200;">relative</div>
<div class="absolute">absolute</div>
<div class="fixed">fixed</div>
<script id="jsbin-source-css" type="text/css">.relative {
position: relative;
width: 600px;
height: 400px;
background-color: yellow;
}
.absolute {
position: absolute;
top: 120px;
right: 0;
width: 300px;
height: 200px;
background-color: green;
}
.fixed {
position: fixed;
bottom: 20px;
right: 40px;
width: 200px;
color:white;
background-color: black;
}
</script>
</body>
</html>
.relative {
position: relative;
width: 600px;
height: 400px;
background-color: yellow;
}
.absolute {
position: absolute;
top: 120px;
right: 0;
width: 300px;
height: 200px;
background-color: green;
}
.fixed {
position: fixed;
bottom: 20px;
right: 40px;
width: 200px;
color:white;
background-color: black;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment