Center CSS Icon

So im embedding icons via css / divs like

.icon
{
width:16px;
height:16px;
background-image:url(url.jpg);
}

then i embed like

<div class="icon"></div>

problem is I want this icon to be centered in the page, but its being quite stubborn, center tags, the div attribute align="center", etc, dont work.

Please show us your entire code (at best by posting a link to the page in question). I’m 100% sure that the way you’re trying it is not the correct approach. The fact that you’re adding an empty element just to apply a background image just can’t be right.

So im embedding icons via css / divs like

.icon
{
width:16px;
height:16px;
background-image:url(url.jpg);
}

then i embed like

<div class="icon"></div>

problem is I want this icon to be centered in the page, but its being quite stubborn, center tags, the div attribute align="center", etc, dont work.


Try replacing your css with this :


.icon
{
width:16px;
height:16px;
background-image:url(url.jpg);
background-position:center;
}


I am not sure what you want. Just in case this may help you.


Regards.