Difference between revisions of "CSS Off-screen text"

From Level Access Web Labs
Jump to navigation Jump to search
Line 25: Line 25:
  
 
   <hr>
 
   <hr>
   <label class="hidden" id="e1"> Email?  </label>
+
   <label class="hidden" for="e1"> Email?  </label>
   <input type="radio" id+"e1" />
+
   <input type="radio" id="e1" />
  
 
</body>
 
</body>

Revision as of 15:01, 6 May 2016

The text below this text but above the horizontal rule is hidden off screen with CSS clipping.



Off-screen label for radio button below this horizontal rule


CSS Code used in this example

.hidden
{
  position: absolute;
  clip: rect(1px 1px 1px);  /* for Internet Explorer */
  clip: rect(1px, 1px, 1px, 1px);
  padding: 0;
  border: 0;
  height: 1px;
  width: 1px;
  overflow: hidden;
}