Amanda Sky Amanda Sky - 4 months ago 10
HTML Question

create left and right bracket with CSS

I wish to create a [ and ] bracket just with CSS is there anyway I can specify the top and bottom border so it looks like a bracket?

.bracket
{
border-top:20px;
border-bottom:20px;
border-right:none;
border-left: 1px solid black;

}


Is there a way to do this without slicing the image up?

Answer
<span class="b">text</span>  

 <style>
.b:after{content:"]"}
.b:before{content:"["}
</style>

working example: http://codepen.io/yardenst/pen/bhGIy

Comments