This is the folder where I save my image:
G:\xampp\htdocs\b2w\wp-content\themes\bootstrap-to-wordpress\image
in the stylesheet I write the code for background image like:
background: url('/wp-content/themes/bootstrap-to-wordpress/image/bg.jpg') 50% repeat fixed;
It doesn't work. I'm new to wordpress. Can anyone please help about what the wrong I'm doing here?
I just read a lot in online and get the answer to my question. The answer is "I have to write my URL in the order as it starts from where my stylesheet is located. This is only for the background images."
Related
So my header image shows up when I open Chrome from my code editor (webstorm) but after I close webstorm and open index.html manually from my project folder, the header image won't load/show up, background-image: url("/assets/heroimage.jpg"); any idea why?
Same problem on github when I host my website
Thanks
Have you tried with a "relative path" adding a point at the start?
background-image: url("./assets/heroimage.jpg");
as mentioned Here the problem is with how you linking the image to the CSS.
Try removing double quotes and removing unnecessary backslash:
background-image: url(assets/heroimage.jpg);
or
background-image: url(./assets/heroimage.jpg);
Hope it helps :)
I tried to include a background image on my landing page. My CSS file is here:
/modules/core/css/core.css
My image file is here:
/modules/core/img/image.jpg
In the css file I tried doing this:
background-image: url("../img/image.jpg");
I also tried doing this:
background-image: url("core/img/image.jpg");
However, none of them are working or the solutions I looked at this site for other similar questions. Anyone knows how to fix this?
if CSS /modules/core/css/core.css and image is /modules/core/img/image.jpg,
background need be background-image: url("../img/image.jpg"); but are you sure is jpg or JPG, sometimes this can be bug :)
Check the network tab in inspector to see what happens when the browser tried to load the image. What do you get in the status column?
I am trying to setup a simple div which I have done many times in the past but something is going wrong... Here is a fiddle of my code.
http://jsfiddle.net/psychoticpanda/HTtRs/
Either I am going insane, hitting a glitch in something or it is too late for me to code after a 13 hour day of class... Please help me feel sane and help me out! The image works when it is used as <img src="(IMAGE)" /> but when I use it as a background-image: url("image"); in CSS it doesn't work...? I need it to be a background for buttons to go on top without problems! Please help...
If the url() contents are a relative path it is derived from the path of the stylesheet location. So if your stylesheet is /css/file.css and the rule is url(image/filename.png) it will look for it in /css/image/filename.png. You should probably use an absolute path for the image.
Your file path of url("images/map.png") assumes that your images folder is in the same folder as the CSS file. If that's not the case, your path is incorrect. If it is the case, the next thing I'd try (but consider this anyway) is to use background: instead of background-image:—which, on its own, doesn't provide any information about its positioning or whether or not you want the image repeated.
Hi this way i give my image path in css. it works some time but not all the time.my site may have many sub folder and then the below path may not works. so i want to specify path in my css in such a way where ever i am on my site pages or whatever pages i will looking at but image show display on page. so tell me what trick i should apply in my css for specifying which works same way for all the pages. thanks
.labeltag {
background-image: url(../images/arrowbackground.png);
margin:2px;
border-radius:5px;
}
Try finding the image from the root of your site instead:
.labeltag{background-image:url('/images/arrowbackground.png');}
Assuming 'images' is a folder in your root directory
edit: I understand code can be more readable (regarding the suggested edit), but there is a reason I type it like this - it's better performance.
I'm having a problem where I have a background image that will show up perfectly fine when I'm using it in dreamweaver, but once I upload my site and the CSS files and everything it won't show.
Here's my CSS code:
.ELSsubbg {
background-image: url('../images/NTG_images.jpg');
background-repeat:no-repeat;
background-position:top left;
}
Any help would be great.
Because you are using a relative path in your CSS, where the stylesheet is looking for the image may be different than where you are seeing it when you go to it directly in the browser.
Try using an absolute path to your images directory instead of a relative one. Assuming you can see the image in your browser at http://www.website-name.com/images/NTG_images.jpg try removing the dots to make the path absolute from the root of your website.
background-image: url('/images/NTG_images.jpg');
Have you uploaded the image? Have you uploaded it to the right place? Is the CSS looking for it where you think it should be?
The easiest way to answer these questions is to use the browser's developer tools (eg Firebug) to watch the network traffic your page generates. Look for the request where it tries to load the graphic. Is it giving a 404 error? Probably.
If you are getting a 404, look at the URL it's calling to find out why. The answer should become clear.