Search code examples
htmlcssstyling

Get links in div on separate lines

I have following code:

    <div>
        <a href="www.google.com">Google</a>
        <a href="www.amazon.com">Amazon</a>
        <a href="www.apple.com">Apple</a>           
    </div>

This gives:

 Google Amazon Apple

How do I get 

Google
Amazon
Apple
Solution

  • This will solve the issue without making the whole line clickable:

    div a:after {
  content: "";
  display: block;
  height: 0;
  width: 1px;
}

    Check the pen: http://codepen.io/anon/pen/QbKLvN