My Background image doesn't show up and is not inspected in the browser [closed]


Tags: javascript,html,css

Problem :

I used mozila and I try to "inspect element" to see if my background image is there. The inspect element even doesn't show the css style mark up like background-image: blah blah; at all.

I am very sure that I have written the code correctly:

       background-image: url ('social-icon/button.png');

Some discussion out there said that it may be caused of "javascript" and adviced to disable the javascript, but I don't know how to do that. Eventhough it is true that the problem is the javascript and it means that I can't use Javascript in my html file, it will be worse.

I am just confused?

EDITED :p

LOL, THE PROBLEM IS BECAUSE I HAVE A SPACE BETWEEN URL AND THE SOURCE. IT SHOULD BE LIKE

        url{there is no space here}('social-icon/button.png');

It's so funny how we all can't see a little problem when our focus is to the another point of the question. :D :D :D



Solution :

Is your css file correctly linked in the .html? I understand it as you have your img as a background-image in css?

<link rel="stylesheet" href="yourCss.css">

It's a long shot, but try with removing the image part,

background: url('social-icon/button.png');

    CSS Howto..

    How to automate background width in CSS

    how to apply css transition to background image

    How do I make my elements occupy the width of their “max-width” specification?

    How does CSS handle specificity tie?

    How can I prevent the textarea from stretching beyond his parent DIV element? (google-chrome issue only)

    How to determine if image is hyperlinked?

    How to load a new stylesheet when switching from JQuery Mobile site to PC site

    How to trigger one element inside a div on mouse hover in CSS

    CSS - How do I style a select to fully occupy the td it is in

    How to make a CSS rule act differently inside another div tag?

    How to access the physical Bundled and Minified js / css created by BundleConfig class

    How to center multiple div elements within a parent div?

    How to create text block over the images with css and make it responsive

    How semantic X/HTML can save time when we will write CSS?

    How to make this styling with css

    How can I hide a button when scrolled to the top of a page?

    How do I get rid of this blue halo around the close dialog button with jqueryui?

    How to add schedule elements into this calendar?

    How to have a horizontal line at the middle of a html heading with CSS?

    Dynamic HTML 3 layers nested quotes - how to do?

    How to specify max-height css property to Screen size

    How to make a button with image inside?

    Is there any tutorial to teach me how to design the sidebar like this website? [closed]

    How can I use CSS borders to visually group my sections?

    How to make this css crossbrowser?

    In laravel 4, How to render in template (blade) plain css or js from file?

    show a div over another when resizing on hover

    CSS: How to define spacing between responsive columns

    How to create a Page Header (an Image) for print using css

    How do I do this CSS border-bottom