Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html><meta charset=utf-8 /><title>Centered Heading + Horizontal Line</title>
<style>
  h1 {
    font: 1.2em sans-serif;
    text-align: center;
    border-bottom: solid 1px;
    
    /* pull the border up*/
    height: .6em; 
    
    /* push the paragraph down */
    margin-bottom: 1.4em;
  }
  /* line cover */
  h1:first-line{
    background-color: white;
  }
  /* additional padding */
  h1:before,
  h1:after{
      content: '\0000a0 \0000a0'; 
  }
  
  /* for demonstrational purpose */
  .ie:before,
  .ie:after{
      content: ''; 
  }
</style>
  
<h1>My awesome headline</h1>
<p>This was such a new idea to Alice, that she was quite silent for a  minute or two, which gave the Pigeon the opportunity of adding, 'You're  looking for eggs, I know THAT well enough; and what does it matter to me  whether you're a little girl or a serpent?'
  
<h1 class='ie'>How it appears in IE7</h1>
<p>'It matters a good deal to ME,' said Alice hastily; 'but I'm not looking for eggs, as it happens; and if I was, I shouldn't want YOURS: I don't like them raw.'
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers