GoFuckYourself.com - Adult Webmaster Forum

GoFuckYourself.com - Adult Webmaster Forum (https://gfy.com/index.php)
-   Webmaster Q & Fuckin' A (https://gfy.com/forumdisplay.php?f=27)
-   -   Images in CSS Not Showing In IE (But fine in Chrome) (https://gfy.com/showthread.php?t=1110158)

amanda36c 05-21-2013 01:10 PM

Images in CSS Not Showing In IE (But fine in Chrome)
 
I just don't understand, for the life of me, why the images are showing up fine in Chrome but not in IE.

I want to make my site browser-friendly (and yes, unfortunately, that means IE-friendly as well). So, can anyone have a look and tell me how to get IE to display the images, loike Chrome is doing. This tells me it's not the path that is the problem. What is, then?

Layman's terms, please. I'm really super new to css.

Thanks for any help. :helpme

camgirlclubs.com/CamGirl%20Clubs/index.html

GameForAdult 05-21-2013 06:28 PM

IE sucks :)

I see no images on IE and FF, there are non!?

maybe another URL ?

sarettah 05-21-2013 07:07 PM

Quote:

Originally Posted by GameForAdult (Post 19634805)
IE sucks :)

I see no images on IE and FF, there are non!?

maybe another URL ?

Yeah, I see the same presentation in all 3 browsers also. Only image is a big ass background image that is taking a long time to load.

Here is what I am seeing:

IE:
http://www.madspiders.com/images/camgirlsclub_ie.jpg

FF:
http://www.madspiders.com/images/camgirlsclub_ff.jpg

Chrome:
http://www.madspiders.com/images/cam...lub_chrome.jpg

Hope that helps.

.

sarettah 05-21-2013 07:20 PM

Btw, your background image bg98.png is 1.25MB, that is way too big. You need to knock that down a whole bunch. If you ever get a bunch of traffic you will be paying for a bunch of bandwidth that does nothing for you. Plus it is slowing your page load way the hell down.

You need to get those pages to just pop into place.

If you feel you must keep that image then optimize it as a jpg. Doing it on a medium setting you can knock it down to 55k or so. The PNG is doing nothing for you (imho).

On that background image you have text which is hidden by the rest of your page. That again makes the image bigger (storage wise) and the text is doing nothing for you.

My opinion, kill the background image completely. You will get a much better page load. You have a couple of seconds max to grab someones attention on the net, if they spend that time waiting for your page to load you have lost them.

I did a test in IE and I did a slow count to 7 before the background image showed in the browser. Wasted time.

Just imho, of course.

Hope that helps.

.

sarettah 05-21-2013 07:26 PM

This is the image you have as the background, al 1.25 MB of it:

http://camgirlclubs.com/CamGirl%20Clubs/images/bg98.png

This is the same image optimized as a jpg at around 60kb:

http://madspiders.com/images/camgirlsbackground.jpg

Do you see any noticeable difference that would warrant using the png image which is taking 19 times more space and bandwith?

.

sarettah 05-21-2013 08:20 PM

never mind

.

Tent Pitcher 05-21-2013 09:23 PM

Quote:

Originally Posted by amanda36c (Post 19634407)
I just don't understand, for the life of me, why the images are showing up fine in Chrome but not in IE.

I want to make my site browser-friendly (and yes, unfortunately, that means IE-friendly as well). So, can anyone have a look and tell me how to get IE to display the images, loike Chrome is doing. This tells me it's not the path that is the problem. What is, then?

Layman's terms, please. I'm really super new to css.

Thanks for any help. :helpme

camgirlclubs.com/CamGirl%20Clubs/index.html

You seem to have some conflicting directives in your CSS, one of which is likely confusing IE (it isn't hard to do). I see what you are trying to do with the background image here:

Code:

background-clip: border-box, border-box, border-box;
background-color: #FFFDEA;
background-image: url("images/img01.jpg"), url("images/bg98.png"), none;
background-origin: padding-box, padding-box, padding-box;
background-position: 0 0%, 0 0%, 0 0;
background-repeat: repeat-x, no-repeat, repeat;
background-size: auto auto, cover;

But this is the way I would do it (and I am using exactly this on some sites that work across all browsers):

Code:

background-image: url("images/img01.jpg");
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;

Several of your directives specify multiple definitions (like background-image: url("images/img01.jpg"), url("images/bg98.png"), none;)...that is CSS3 which is not fully supported or supported at all depending on the browser that you are using.

amanda36c 05-22-2013 10:35 AM

Quote:

Originally Posted by GameForAdult (Post 19634805)
IE sucks :)

I see no images on IE and FF, there are non!?

maybe another URL ?

That's really odd. Besudes myself of course, you're the only one (of dozens that have responded here and on Twitter) who doesn't see the images or bg. Hmmm.

Thanks for your feedback. I'll figure this out, eventually. I think. I hope. :)

amanda36c 05-22-2013 10:40 AM

Quote:

Originally Posted by sarettah (Post 19634860)
This is the image you have as the background, al 1.25 MB of it:



Do you see any noticeable difference that would warrant using the png image which is taking 19 times more space and bandwith?

.

It won't let me quote you because there are urls in your post and me being a newbie, am not yet old enough to post urls. lol Oh c'mon GFY!!! Anyway ...

I didn't know it was the background that was taking the page so long to load. I do much prefer the png output over any jpeg, so perhaps I'll cut the image in half, use just the left half, fading to black so that on the right side, you can't tell it isn't part of the image, rather just a plain black background.

Thanks so much for your help. Really appreciate it.

amanda36c 05-22-2013 10:44 AM

Quote:

Originally Posted by Tent Pitcher (Post 19634945)
You seem to have some conflicting directives in your CSS, one of which is likely confusing IE (it isn't hard to do). I see what you are trying to do with the background image here:

Code:

background-clip: border-box, border-box, border-box;
background-color: #FFFDEA;
background-image: url("images/img01.jpg"), url("images/bg98.png"), none;
background-origin: padding-box, padding-box, padding-box;
background-position: 0 0%, 0 0%, 0 0;
background-repeat: repeat-x, no-repeat, repeat;
background-size: auto auto, cover;

But this is the way I would do it (and I am using exactly this on some sites that work across all browsers):

Code:

background-image: url("images/img01.jpg");
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;

Several of your directives specify multiple definitions (like background-image: url("images/img01.jpg"), url("images/bg98.png"), none;)...that is CSS3 which is not fully supported or supported at all depending on the browser that you are using.

Now I'm terrified to change the css. I've done it 30x too many and well, you see what happened! lol Lemma try what you suggested and maybe I'll get lucky. Thanks for your help.

sarettah 05-22-2013 11:26 AM

Quote:

Originally Posted by amanda36c (Post 19635763)
Now I'm terrified to change the css. I've done it 30x too many and well, you see what happened! lol Lemma try what you suggested and maybe I'll get lucky. Thanks for your help.

I you are not doing it already, when you go to change your css make a quick backup copy of your current css so that if you get lost you can start your trip over easily.


.

amanda36c 05-27-2013 11:19 AM

Quote:

Originally Posted by sarettah (Post 19635841)
I you are not doing it already, when you go to change your css make a quick backup copy of your current css so that if you get lost you can start your trip over easily.


.

Always make backups. I make backups of backups! lol Thanks for your advice above, Very helpful. I'm going with an entirely different template though which has a small area in the top left corner for a background image, which will definitely cut down the download time.

3 more posts till I'm at 30 and can post a url :thumbsup

CPA-Rush 05-27-2013 03:12 PM

why u have space on ur url ?. this can break ur links

css can be tricky at first sexy girl lol it's not as easy as it seem to be

u can look at my website i have been trying to get full width footer but no luck ,

amanda36c 05-27-2013 04:51 PM

Quote:

Originally Posted by rosx (Post 19643113)
why u have space on ur url ?. this can break ur links

css can be tricky at first sexy girl lol it's not as easy as it seem to be

u can look at my website i have been trying to get full width footer but no luck ,

What do you mean "'space on my url"? Are you referring to this page? http://camgirlclubs.com

CPA-Rush 05-27-2013 04:59 PM

no i mean the directory "CamGirl%20Clubs/"

sarettah 05-27-2013 06:56 PM

Quote:

Originally Posted by rosx (Post 19643256)
no i mean the directory "CamGirl%20Clubs/"

Yeah, the %20 indicates a space. You should never have spaces in urls or filenames even though systems will let you. It can screw some programs up.

Quote:

Originally Posted by amanda36c (Post 19642771)
Thanks for your advice above, Very helpful.

You are quite welcome.

.

CPA-Rush 05-27-2013 08:52 PM

its standard on web that links sent over http use ASCII characters mostly . urls shouldn't contain spaces
in your case javascript probably encode it for u because its not acceptable to have spaces

amanda36c 05-27-2013 10:42 PM

Thanks guys but this page was very temporary. The site itself doesn't have 'spaces' or funky characters. It's actually fine. That was just to show everyone what the site would look like. I've decided to go with this instead http://camgirlclubs.com --- without spaces. Thanks a bunch for your help everyone. You guys are great!


All times are GMT -7. The time now is 11:16 PM.

Powered by vBulletin® Version 3.8.8
Copyright ©2000 - 2025, vBulletin Solutions, Inc.
©2000-, AI Media Network Inc