N NeoCHI Active member Aug 10, 2013 #1 Hi I noticed with the responsive theme in 1.2 the logo displays fuzzy on retina screens. Anything we can do about this?
Hi I noticed with the responsive theme in 1.2 the logo displays fuzzy on retina screens. Anything we can do about this?
JulianD Well-known member Aug 10, 2013 #2 If you are placing your logo as a standard image, duplicate the size of the logo and then scale it down with css. Upvote 0 Downvote
If you are placing your logo as a standard image, duplicate the size of the logo and then scale it down with css.
N NeoCHI Active member Aug 10, 2013 #3 I don't exactly understand. Can you be more specific? Upvote 0 Downvote
Jeremy in memoriam 1991-2020 Aug 10, 2013 #4 Basically, you need a higher resolution image. Upvote 0 Downvote
JulianD Well-known member Aug 10, 2013 #5 If your logo is 100x50 then create one version of your logo with size dimensions of 200x100 and scale it down with css like Code: .logo {width: 100px; height: 50px;} Upvote 0 Downvote
If your logo is 100x50 then create one version of your logo with size dimensions of 200x100 and scale it down with css like Code: .logo {width: 100px; height: 50px;}
A Andy.N Well-known member Aug 10, 2013 #6 Or just use a SVG format logo. Problem solved. Upvote 0 Downvote
Shyuan Well-known member Aug 13, 2013 #7 @NeoCHI This code works for me for xF1.1.5. I assume it works for 1.2 too Code: #logo img { width: 113px; height: 90px; } where my actual logo image size is 226px 180px. Did exactly what @JulianD said, "scale it down with css". Hope this helps. Upvote 0 Downvote
@NeoCHI This code works for me for xF1.1.5. I assume it works for 1.2 too Code: #logo img { width: 113px; height: 90px; } where my actual logo image size is 226px 180px. Did exactly what @JulianD said, "scale it down with css". Hope this helps.
ekool Active member Jun 19, 2014 #8 Instead of specifying the width explicitly I have specified max-width: 50% and that works and allows it to resize smaller on mobile/responsive. Upvote 0 Downvote
Instead of specifying the width explicitly I have specified max-width: 50% and that works and allows it to resize smaller on mobile/responsive.
