Separator line with text
von Moritur am 25. July 2012
There are many snippets for separator lines out there but I didn’t find a single one with a text in the middle. Here you got one:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
.separator { width: 100%; border-bottom: 1px solid #60636a; text-align: center; height: 18px; margin-bottom: 15px; } .separator span { line-height: 15px; padding: 0 10px; background: white; /* Color of the element below */ display: inline-block; margin-top: 10px; color: #60636a; } |
This is the neccessary html:
1 2 3 |
<div class="separator"> <span>or</span> </div> |
That’s how I needed the separator line:
Create a new account
or
Order as guest
Do you know a better method to do this? Maybe without a fixed background color?
2 Kommentare
good job. Nice code, works good.
by hit9 on 31. March 2013 at 07:07. #
Thanks !!! this was exactly what I needed and works perfectly !
by Reni64 on 4. March 2014 at 15:28. #