I can't edit the html, so I want to modify the background image using css to a Glyphicon. I would like to use glyphicon glyphicon-arrow-right. I know I could replace the .gif file but I would like to avoid having to do that.

The property you're trying to override is called background-image. All you need is an equal or higher specificity selector in your CSS (equal if it loads last) and a valid property value. You can do it in stylesheet (.css file), in <style> tag or in style="" attribute..css file:

You have to hide the default glyphicon then use custom image. Try these lines:.glyphicon-search::before { content:none!important; } .glyphicon-search { background-image:url(../ur-image); height:20px; width:20px; background-repeat:no-repeat; background-size:cover; }

For what you want to achieve, you can also simply use keyboard space, which gives the standard space between words. To have more space, use the CSS / HTML character code “\000A0”. Examples: ‘Company\000A0Street’; (gives normal spacing between the words) ‘Company \000A0 Street’; (add a keyboard space to add one more space between text)

CSS can offer various ways to incorporate images into web pages, allowing the developers to control how images are displayed, their size, and even how they respond to the different devices. These are the following ways to add images: Background images are used to set the image as the background of an HTML element, such as the div, section, or body.