Internet Explorer on Windows 8 not...

User 271657 Photo


Ambassador
3,816 posts

It seems Win 8 mobile has no support for SVG img files:
http://caniuse.com/#search=svg
You could use a PNG if you want to be sure it shows up for everyone.
Or you could try this: http://pivotallabs.com/use-svg-windows-development/ :o
I love deadlines. I like the whooshing sound they make as they fly by. (Douglas Adams)
https://www.callendales.com
User 327365 Photo


Registered User
26 posts

Thanks Ernie. It's possible it's just on windows phones, mine is win 8 (not 8.1) so maybe it won't be too much of a problem given they don't have much share of the market. Did you find the top nav off centre too?

Paintbrush, I'll try the png route first but I'll also have a go at pivotalllabs suggestions. I don't have Illustrator but I see there is a way using Inkscape which is the prog I used to make the logo. Thanks for your help. :-)
User 188640 Photo


Registered User
895 posts

Paddy,

Yes, the top nav is a little to the right on my phone but it doesn't 'look' like it's out of place. I thought that was where you had it set.
A Rose is Just a Weed in a Corn Patch!
User 271657 Photo


Ambassador
3,816 posts

It's just right of center on my phone; if the blue block were divided into 4 columns, the menu would be the 3rd from left.
This is all I see for the NAV:
.container.nav {
margin-bottom: 0;
}
So that entire blue band is the container.nav. Have you tried making a DIV just for the nav within the blue section*, so it could be positioned to the right at full screens and shift to center at small/phone screens?
*would that be a sub-grid in RLM?
Also, is the tag-line supposed to disappear at phone size?

About using PNGs in resp. designs...They will get pixelated when scaled up from the original size. So start with a size that looks good at your largest screen width. Also, you can set a max-width to ensure it doesn't go beyond its optimal size.
If its original size is 400px wide (for example), put 'max-width: 400px;' in your logo CSS.

Another thought... If the Win8 phone (and my old Kindle) is the only screen/s that don't show the SVG file, you could have just a text title that would display in place of the image. Then you don't need to change your SVG image. :)
I love deadlines. I like the whooshing sound they make as they fly by. (Douglas Adams)
https://www.callendales.com
User 327365 Photo


Registered User
26 posts

Ernie, I did mean for it to be centered but I think I re-do the top nav as per Paintbrush's suggestion. I wanted to get my site online asap so now it's there and working alright (mostly!) I can tweak it a bit more. I've got more pages to add later as well.

Paintbrush, I had a go at using a png logo on a test site, it seems to work but haven't uploaded it to the 'real" site yet. The logo is 600px wide so the max width is already set to that. Also, thanks for the nav ideas. I know I haven't done it in the best way in RLMP so will try your suggestions and hope I can improve on it. Re the tag line, yes I have set it to "none at mobile sizes, but now I can hopefully make it so it doesn't look rubbish ;)

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.