background images reported 404 - css

Some background images didn't show. So I open the browser console, the unloaded pics are reported 404. And then I check my css on the browser console. I find out the url of background images didn't change. But I did change them in css of web path. I also checked the css of web_war_exploded path, it is same as the css of web path. It only didn't changed on browser console.
PS: The original file name of image is src.
When I change src to image, background images are showing.

Try clearing your browser cache - this will reload the css-files.

Related

CSS not showing up when opening with files

My css only works when I open it with live-server. I didn't realized it until I tried opening the file
of my projects. The JS functionality is there, but my project is just stale, just black and white. I'm using sass and live-sass compiler. And also using a map api leaftlet and open weather api. SO please help,
cannot seems to figure out why my css is not present when I open my project on file or in another browser.
I have seen through your file and I think your issue is your image hasn't been loaded.
You have an image of the starry sky, right? You can only see the black and white page with some icons after the search because your image hasn't been loaded.
As you access the page by opening the file, the image URL in your CSS file is the path relatives to the current CSS file, which means the URL should be ../image/night.jpg.
If you access the page through the live server, that URL is the path relative to your host.
Hope that I understand your problem correctly. I am still learning too :)

Won't apply style until refresh HTML

I have index.html and guide.html, I link to the guide.html in the index page. however when i go to the guide one through the link the page won't have the design until I refresh. What am I doint wrong? Each page has its own css.
Here's an image right after I click:
And here's another one right after I refresh:
Could be cached css/html. If it looks right after pressing ctrl+F5 on the page in question, it is working correctly.
Web browsers cache CSS files. I see you're using Chrome for Windows - CTRL + F5 will fully refresh the page, CSS and all.
If this problem appears on a live site for some reason, you could re-name your CSS file to avoid the browser using a cached version. For instance custom.css would become custom-2.css.

ImageResizer.Net - not resizing images

I have recently downloaded Image Resizer .Net due to being interested in to what it has to offer, you can see three libraries in the link I have supplied, I've gone ahead and downloaded all of them.
Rebuilt the project, then navigated to my view and specified a width,height and mode for an image that's getting displayed as shown here.
<img src="http://res.cloudinary.com/dncu6pqpm/image/upload/q_80/#profilePic?w=50&h=50&mode=crop">
This URL is of a car its width is 402 and its height is 300, I want to resize is just to test the functionality, but it doesn't seem to change its size? could this be to do with the fact its referencing an external image?
Update.
This is the rendered HTML
<img src="http://res.cloudinary.com/dncu6pqpm/image/upload/cunaulfla05xjzb5y2fe.jpg?w=50&h=50&mode=crop">
I read your question again and notice the part that your trying to apply it to an external image. Image Resizer will not work with external images as the images is requested directly to the external repository. In order for the image to be able to be resized it has to be served by your hosting server's IIS, where your website (with Image Resizer) is installed.
Make a quick test with a local image and see if that works.

empty css file style my page in dreamweaver?

I had a header.css file for styling my header part of php, I deleted it and recreated the same file in the same place, then I linked it to my page, but when I debug my page via wampserver it is styled like the deleted style sheet!!
This is very strange I deleted all www directory and puted my new files again but that doesn't change!
For example I don't set my header div color in stylesheet but it is gray in the browser!
I haven't had this problem in live view it is just in WampServer. I deleted my browser history but the problem still exists!
I cleared my browser cooking and it solved my problem.

jquery mobile data-icon not appearing on a mobile device

I have a mobile web application (.NET MVC) and I'm using JQuery Mobile (beta 3 & jQuery 1.6.3). My question is regarding the attribute 'data-icon' on various elements. For example, I have an element:
Home
When I run the application locally, everything appears as expected. There is a small circular button with the 'home' image inside. When I deploy my application to my host (Arvixe), this same button renders as expected in Chrome, but does not render as expected on my mobile phone (Nexus One). On my phone, the home icon image does not appear at all.
JQuery mobile is referencing the image sprites in the following manner:
background-image:url(images/icons-18-white.png);
I can verify this image does in fact exist in the proper location, as it appears on the desktop browser, I can get to it with a URL (Desktop and Mobile) and my host log shows that requests to that URL are coming back with a 200 response. I have even connected my web application, while hosted to a weinre server, and I can verify the DOM element does have the correct image path. What's even stranger, is that when I go to jquerymobile.com on my phone, the same icons appear, the problem seems isolated to my hosted site.
Is there something I'm overlooking? Thanks.
I think I may have solved this. When upgrading from jQuery mobile beta 2 to 3, I did not upgrade the corresponding images as well. Grabbing the updated images seems to have done the trick.
Plese place your images folder (which will come from jquery-mobile downloaded zip file) along with your css files.
Ex: If you have copied the .css files to some location named
d:\project\styles\jquery.mobile-1.x.x.css
Then please place the images folder as show below
d:\projects\styles\images
you need to set data-role="button" on anchors for them to appear as buttons with jQM (jQuery Mobile).
see here
Home
this is the only thing I can think of.
The latest jquerymobile has fixed this issue. If not, you need to check the following steps.
check images folder of jquerymobile and jquerymobile CSS are in the same directory
If you put jquerymobile CSS in separate folder, you need to change "path" in this stylesheet

Resources