Question

I am styling my hr and for that,i am having this character § at the center.This is the code

hr.style-eight:after {
 content: "§";
 display: inline-block; 
position: relative;
 top: -0.7em;
 font-size: 1.5em;
 padding: 0 0.25em;
 background: white; 
}

I have looked at several character entities cheat sheets for a square character but nothing so far.Is there square character in the existing html or html5 entities that i can use or an alternative method in css3 that can produce the square?.

Was it helpful?

Solution

From the HTML5 Character Entity Reference (which you've supposedly already looked at):

□
□ □ □
□
□

There's also:

▪
▪ ▪ ▪ ▪
▪
▪

OTHER TIPS

Use borders?

CSS

h1:after{
    content:'';
    display: inline-block;
    width: 5px;
    height: 5px;
    border: 1px solid black;
}

Fiddle

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top