Difference between revisions of "Css"
From Wiki2
| Line 5: | Line 5: | ||
*The Overflow Method relies on setting the overflow CSS property on a parent element. If this property is set to auto or hidden on the parent element, the parent will expand to contain the floats, effectively clearing it for succeeding elements | *The Overflow Method relies on setting the overflow CSS property on a parent element. If this property is set to auto or hidden on the parent element, the parent will expand to contain the floats, effectively clearing it for succeeding elements | ||
*The Easy Clearing Method uses a clever CSS pseudo selector (:after) to clear floats. Rather than setting the overflow on the parent, you apply an additional class like "clearfix" to it. Then apply this CSS: | *The Easy Clearing Method uses a clever CSS pseudo selector (:after) to clear floats. Rather than setting the overflow on the parent, you apply an additional class like "clearfix" to it. Then apply this CSS: | ||
< | <source lang="css"} | ||
.clearfix:after { | .clearfix:after { | ||
content: "."; | content: "."; | ||
| Line 13: | Line 13: | ||
clear: both; | clear: both; | ||
} | } | ||
</ | </source> | ||
===Resposive web design frameworks=== | ===Resposive web design frameworks=== | ||
http://gumbyframework.com/ built on saas | http://gumbyframework.com/ built on saas | ||
Revision as of 11:43, 10 May 2014
floats and clears
http://css-tricks.com/all-about-floats/ clearing floats
- The Empty Div Method is, quite literally, an empty div.
- The Overflow Method relies on setting the overflow CSS property on a parent element. If this property is set to auto or hidden on the parent element, the parent will expand to contain the floats, effectively clearing it for succeeding elements
- The Easy Clearing Method uses a clever CSS pseudo selector (:after) to clear floats. Rather than setting the overflow on the parent, you apply an additional class like "clearfix" to it. Then apply this CSS:
<source lang="css"} .clearfix:after {
content: "."; visibility: hidden; display: block; height: 0; clear: both;
} </source>
Resposive web design frameworks
http://gumbyframework.com/ built on saas
color schemes
http://www.color-wheel-pro.com/color-schemes.html https://kuler.adobe.com/#create/fromacolor
tutorials
- http://www.designer-daily.com/tutorial-how-to-code-your-psd-into-a-html-css-layout-15632
- http://css.maxdesign.com.au/index.htm
- missing manual tutorials in c://tim/books/teck/missing...
