Well, basically i created a image inside a div using the img tag in a HTML file that i've been writing and the image just wont show up on the browser. Inspect says the image cannot be loaded and it's CSS is set to 'display: none!important'.I wasn't able to untick it even in inspect. Can you help me?
No class was declared on the img tag and the div holding it.
I haven't written the 'display:none!important' css anywhere on the page.
3.There are other images in the same page which is displaying perfectly fine. I placed another image on the div which is holding my problem-image and even it is showing up. Renaming the image works too [Although i would like to know why].
The code used:
<div class="col-1"><img src="../Home-Page/images/twitter-logo-silhouette.png" alt="twitter"></div>
Any other image will work fine,The image is now kept renamed by finding it in finder, the error is gone now. But i still would like to know why it is so. If i rename it back. The error will appear once again.
Your adblocker is blocking the image out, i guess.
If you try to rename your file and alt tag without naming twitter it will work, as you mentioned above
Related
I am trying to use a background-image using a "root-relative" path like so : background-image: url("/img/bg.jpg");.
The property is correctly showing in Chrome but the image does not appear. If I change it to be http://localhost:8080/img/bg.jpg it appears.
If I visit http://localhost:8080/img/bg.jpg the image is visible.
If I add a <img style={{width:"100px", height:"100px"}} src="/img/bg.jpg"/> it also appears properly (I am using React).
I browsed SO for a moment and noticed several people having issues with url but none of them was similar.
In case there is any kind of link, I'm using Less with webpack-dev-server. The image is in a static directory.
I finally managed to fix this issue thanks to issue #2248.
I simply disabled the source maps for css-loader and less-loader and that made the trick.
first time poster and html noob here.
For a few hours now ive been trying to use a background picture. I downloaded an image I wanted to use, and set about trying to code it.
No matter what I tried, the image would not display. However, when I tried one of the other images I was using, it displayed just fine.
I tried using just the first letter of the existing image, and the program immediately suggested the image in a dropdown, as well as several other images with names starting with the same letter. However when I tried to use the new images first letter, it did list options, but none of them were the image I had downloaded.
I tried renaming the image, but still no luck.
I havnt included any code just yet, since this seems to not be related to the code itself (Since other images display just fine). Has anyone run into something like this before? Extensive google searches did not yeild anything for me.
In case it matters, I am specifying the background image as part of the Body css.
Thanks in advance for any help.
Please check to ensure your preferred image is located in the same parent folder as your htlm.
As #Patrick Falvey says but if the picture is not in the same folder remeber to / before your file path :)
I have a rather unique problem. I'm trying to get a logo to display, however it simply doesn't show - it will however show in Firebug as it should (i.e. hover over the image and it displays the preview).
I have tried absolute filepaths, relative filepaths and everything else under the sun. The logo sometimes appears for 2-3 seconds upon refresh then will simply vanish from the screen - I've never experienced a problem like this and find this truly mind-blowing.
Am i missing something obvious here?
Link: http://project.n8geeks.com/
I think you should set Height attr for div .logo
With div Img you should set width and height.
I try set height 30px for div .logo. It works.
I went to the link and it seems like its a web server configuration issue, since Chrome's Dev Tools said:
Resource interpreted as Image but transferred with MIME type text/html: "http://n8geeks.com/".
what you need to do is add the png MIMEtype to your web server configuration.
Have you tried using a different image just to test? I have tried it (with firebug) and it seems to work.
The issue was because, for some reason, there was no default .htaccess file - not sure how or why that should effect the displaying of images, but that was the solution for my issue.
This is completely making me crazy. I have two GIF files in the same directory. Navigating to them individually works, but when displaying them using an <img> tag, one loads and the other does not.
Here's a JSFiddle with a working GIF and the troublesome GIF:
http://jsfiddle.net/7Fxbt/
Adblock seems to be blocking the image if it contains _ad
Possible solution - rename the image and update HTML or CSS accordingly.
I have a firefox-specific issue with this page :
http://www.buzzx.com/feedback.php
It renders fine in IE, Safari, Chrome and every other browser invented by man, but in Firefox the background images do not show (The 'Feedback' link on the left and a white box around the content).
Any help appreciated, I'm completely stumped here.
update : the images show if i put in the full path in the css - http://www.buzzx/..../images/... as opposed to having a relative path. but i really want to avoid doing this.
Had a similar problem today, I can't see your css, but, this is what I found out, I had to move the html portion to the bottom of the css, at least below the other background elements I had, so that it would show. I hope this helps.
Just getting into Webdesign HTML & CSS, I had the same problem.
I used Webdwarf webdesigner to build the basic layout for the website. At first it didn't show in Firefox, but then I also put up an over-sized transparent picture made in GIMP. Just a big square with 100% transparancy. I checked it by clearing the cache in advanced options in Firefox and reloading the page. Changed the background picture a few times, hit reload button and it changed straightaway.
Other problem is often the path string. Webdwarf made the CSS coding for the background for me and used the path string from the current location. background-image:url (./images/background.jpg). It seems firefox wont accept a full length string for the background image
You might want to check against a validator, just to make sure.
Line 48, Column 48: document type does not allow element "div" here; missing one of "object", "applet", "map", "iframe", "button", "ins", "del" start-tag
<h1><div class="page_heading"><div class="fleft">Contact Us</div><div
Very weird!
But I noticed one thing: the images don't load when there's a javascript error (I see it with Firebug) related to Google Ads. The message says:
Permission denied to http://googleads.g.doubleclick.net to call the Location.toString method on http://www.buzzarab.com.
Line 0
Try and test the page without Google ads.
Resolved by adding full path to the css, not a real fix but will do for now till a proper fix is found.