Last active
August 29, 2015 14:17
-
-
Save tjtate/0e446c059f0beed59511 to your computer and use it in GitHub Desktop.
CSS3 columns
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<ul class="list-column-2"> | |
<li><a href="">How do I unsubscribe?</a></li> | |
<li><a href="">How do I remove my subscription from automatic renewal?</a></li> | |
<li><a href="">How can I the find the expiration date of my subscription?</a></li> | |
<li><a href="">What is my refund policy?</a></li> | |
<li><a href="">What is my username and password?</a></li> | |
<li><a href="">What is Jim Rickards' Strategic Intelligence?</a></li> | |
<li><a href="">Does my subscription come with an automatic renewal option?</a></li> | |
<li><a href="">When will I be charged for automatic renewal?</a></li> | |
<li><a href="">How and when will my money be returned to me?</a></li> | |
<li><a href="">I’m not going to use my Agora Financial Reserve membership anymore. What should I do?</a></li> | |
</ul> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
ul { | |
&.list-column-2 { | |
column-count:2; | |
//optional column gap | |
column-gap:10px; | |
li { | |
//prevents one li's text from moving to the 2nd column | |
-webkit-column-break-inside: avoid; | |
//ff uses page break for now | |
page-break-inside: avoid; | |
//future standard | |
break-inside: avoid; | |
} | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment