Skip to content

Instantly share code, notes, and snippets.

@mhulse
Created April 10, 2012 22:33
Show Gist options
  • Save mhulse/2355141 to your computer and use it in GitHub Desktop.
Save mhulse/2355141 to your computer and use it in GitHub Desktop.
CSS example of a floated images with a non-wrapping caption to the side.
img.img01 {
display: block;
margin: 0 auto;
}
img.img02 {
margin: 0 0 10px 10px;
float: right;
display: inline;
}
img.img03 {
margin: 0 10px 10px 0;
float: left;
display: inline;
}
/*
**
** Captions to the side:
** http://pmob.co.uk/pob/caption-clear.htm
** Use in conjunction with .img02/.img03 classes.
**
** Pseudo-example:
** <div class="clear"><img class="img03"><div class="oa">...</div></div>
**
*/
.oa { overflow: auto; }
* html .oa { height: 1%; }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment