Skip to content

Instantly share code, notes, and snippets.

@dtran320
Created May 13, 2011 07:45
Show Gist options
  • Save dtran320/970160 to your computer and use it in GitHub Desktop.
Save dtran320/970160 to your computer and use it in GitHub Desktop.
Some CSS overlay stuff
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<style>
.container1, .container2 {
width: 300px; height: 200px; float: left;
padding: 10px; margin-right: 10px; margin-bottom: 10px;
}
.container1 {
background: #ff0000;
}
.container2 {
background: #00ff00; clear: right;
}
.overlay:hover {
opacity: 0.3; -moz-opacity: 0.3;
filter: alpha(opacity=30);
position: relative;
}
</style>
</head>
<body>
<div class="overlay">
<div class="container1">
foobar blah blah
</div>
</div>
<div class="overlay">
<div class="container2">
foobar lorem ipsum
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment