Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

overflow hidden, new block formatting context

  • Loading branch information...
commit 9bb82e89164a816968f6b7c44e3609e5fa85501b 1 parent d4c6914
@stubbornella authored
View
5 core/grid/grids.css
@@ -1,5 +1,4 @@
-.line:after,.lastUnit:after{clear:both;display:block;visibility:hidden;overflow:hidden;height:0 !important;line-height:0;font-size:xx-large;content:" x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x ";}
-.line{*zoom:1;}
+.line,.lastUnit{overflow:hidden; *overflow:visible;*zoom:1;}

Can I ask why you changed the new block formatting context technique to overflow:hidden? Was there something wrong with the old technique?

This change is wrong due to accessibility concerns. Avoid overflow hidden. I recommend you to revert this change.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
.unit{float:left;}
.size1of1{float:none;}
.size1of2{width:50%;}
@@ -11,4 +10,4 @@
.size2of5{width:40%;}
.size3of5{width:60%;}
.size4of5{width:80%;}
-.lastUnit{display:table-cell;float:none;width:auto;*display:block;*zoom:1;_position:relative;_left:-3px;_margin-right:-3px;}
+.lastUnit{float:none;width:auto;_position:relative;_left:-3px;_margin-right:-3px;}
View
6 core/media/media.css
@@ -1,9 +1,5 @@
/* ====== media (requires mod.css) ====== */
-.media{margin: 10px;}
-.media:after, .bd:after{clear:both;display:block;visibility:hidden;overflow:hidden;height:0 !important;line-height:0;font-size:xx-large;content:" x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x ";}
-.media .bd{display:table-cell; zoom:1;}
-.media .bd > :first-child{margin-top:0;}
-.media .bd > :last-child{margin-bottom:0;}
+.media{overflow:hidden;*overflow:visible;zoom:1;}
.media .img{float:left;/*margin-right: 10px;*/}
.media .img img{display:block;}
.media .imgExt{float:right; /*margin-left: 10px;*/}
View
3  core/media/media.html
@@ -18,7 +18,7 @@
</div>
- <div class="media attribution">
+ <div class="media">
<a href="http://twitter.com/stubbornella" class="img"><img src="http://placehold.it/32x32" alt="img" height="32" width="32" /></a>
<div class="bd">
<p class="ptn"><a href="http://twitter.com/stubbornella">@Stubbornella</a> <span class="detail">14 minutes ago</span></p>
@@ -58,6 +58,7 @@
<div class="bd">
<p>Last week I went to Yahoo! to give a talk about design performance for YUI theater.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+ <p>SupercalifragilisticexpialidociousSupercalifragilisticexpialidociousSupercalifragilisticexpialidociousSupercalifragilisticexpialidocious-is-a-really-long-word.</p>
</div>
</div>
View
4 core/module/mod.css
@@ -7,9 +7,7 @@ version: 0.2
/* mod */
.mod{margin:10px;}
.mod .inner{/*background: url(skin/transparent.png) repeat left top;*/}
-.bd,.ft, .hd{display: inline-block; width:100%; *display:block; *width:auto; zoom:1;}
-.inner:after,.hd:after,.bd:after,.ft:after{clear:both;display:block;visibility:hidden;overflow:hidden;height:0 !important;line-height:0;font-size:xx-large;content:" x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x ";}
-.inner{position:relative;}
+.bd,.ft, .hd{overflow:hidden; *overflow:visible; zoom:1;}
b{display:block;background-repeat:no-repeat;font-size:1%;position:relative;z-index:10;}
.tl, .tr, .bl, .br{height:10px; width:10px;float:left;}
.tl{background-position: left top;}
View
6 core/module/mod_doc.html
@@ -4,6 +4,11 @@
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Standard Module Format</title>
<link rel="stylesheet" type="text/css" media="all" href="../../all.css" />
+<!--<link rel="stylesheet" type="text/css" media="all" href="mod_debug.css" />-->
+<style type="text/css">
+.posAbsolute{position:absolute;background-color:red;}
+.posAbsolute strong{margin-top: -15px;display:block; background-color:green; height:20px; width:20px;}
+</style>
</head>
<body>
<div class="page">
@@ -88,6 +93,7 @@
</div>
<div class="bd">
<p>Body</p>
+ <p class="posAbsolute">Absolute positioned element <strong>neg margins</strong></p>
</div>
</div>
<b class="bottom"><b class="bl"></b><b class="br"></b></b>
View
1  core/module/mod_skins.css
@@ -104,7 +104,6 @@
background-image:-moz-linear-gradient(0% 8% 270deg, #E2E2E2, #FFFFFF, #FFFFFF 77%);}
.bam{background: #00477a url(skin/header_glossy.png) repeat-x left top;color: #fff;font-size:120%;padding:5px 10px;}
.bam h1,.bam h2,.bam h3,.bam h4,.bam h5,.bam h6{font-size:100%;color:#fff;padding:0;}
-.gonz{background:url(skin/gc_header.png) no-repeat left top;}/* messed up */
.online{background: #9a9400 url(skin/online.png) repeat-x left top;color: #000;font-size:120%;padding:5px 10px;}
.online h1,.online h2,.online h3,.online h4,.online h5,.online h6{font-size:100%;color:#000;padding:0;}
.help{background: #b20029 url(skin/help.png) repeat-x left top;color: #fff;font-size:120%;padding:5px 10px;}
Please sign in to comment.
Something went wrong with that request. Please try again.