Joomla Templates Club 406,261 posts

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#940644

Hi
Kindly share the url of site ,so that i can check this issue on your site .

[gary1234 Friend gary1234Join date: July 2008Posts: 93Downloads:40Uploads:6 Thanks: 3]

#940883

Here is the link to the website.

http://caninfo1.securesites.net/dcc/index.php

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#940973

Hi
Logo is using the max width as it can get in the all views . If you want to make it small for mobile view add below code in custom.css file

@media (max-width:468px) {.logo img { max-width:200px}

chnage the width value with your value .

[gary1234 Friend gary1234Join date: July 2008Posts: 93Downloads:40Uploads:6 Thanks: 3]

#941186

Adding that piece of css code changes the default look of the header on the website. The change removes the background images and basically changes the background of the header to white.

Thanks

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#941285

Hi
i am not able to understand your native language in last post .
The code is for the resize the logo image .
Did u solved it now ?

[gary1234 Friend gary1234Join date: July 2008Posts: 93Downloads:40Uploads:6 Thanks: 3]

#941531

I have attached to 2 images, one shows the header with the backgrounds showing before the css code was added, the other shows the header after the css code is added. When the css code is added all the header styling is removed.

---

Attachments:

1. 
2. 

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#941620

Hi
Please check it again .
This is the code

@media (max-width:468px) {.logo img { max-width:200px}

After add it in custom.css : http://prntscr.com/bhra6r
In mobile view : http://prntscr.com/bhrag1
Code is working : http://prntscr.com/bhranc

[gary1234 Friend gary1234Join date: July 2008Posts: 93Downloads:40Uploads:6 Thanks: 3]

#942161

While the page’s logo scales once, say on a phone it does not scale properly on other mobile devices like a tablet.
http://caninfo1.securesites.net/dcc/index.php

Also, if you leave the page and go to a K2 page the logo is scaled down no matter how the web page is scaled.
http://caninfo1.securesites.net/dcc/index.php/agent-listing

Thanks

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#942280

Hi
On K2 page logo is small because the default style is override by the code added by you in custom.css file k2 images . http://prntscr.com/bixksg
Add below code in custom.css file to avoid this

@media (min-width: 992px) {
.logo-control .logo-img {
    display: block;
    max-width: none !important;
}}

This is the view i am getting in Ipad : http://prntscr.com/bixl8f
Also for k2 pages seems you are using different template style and using small logo option for that .
this is reason the logo is small in the iPad for K2 .
Disable the small logo option if you want to show big size logo .

[gary1234 Friend gary1234Join date: July 2008Posts: 93Downloads:40Uploads:6 Thanks: 3]

#943004

I am using the default template for the K2 pages.
Here is the image of the webpage on my Galaxy tablet

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#943035

Hi
I have not found the screenshot in your last post . Kindly try to add the suggested code in custom.css file .
and it will work :

@media (min-width: 992px) {
.logo-control .logo-img {
    display: block;
    max-width: none !important;
}}

Also provide me screenshot of issue and screen size in which you are getting the problem . You can also send a temp super user details via Private reply , so i can fix it directly on your site .

[gary1234 Friend gary1234Join date: July 2008Posts: 93Downloads:40Uploads:6 Thanks: 3]

#943335

I have added the following and have provided a screen shot of the tablet that I am viewing the webpage on, also I am not sure were to go to disable the small logo option if you want to show big size logo. If you meant in the Template section of the website, I have tried that and it did not work… @media (min-width:992px) {.logo-control .logo-img { display: block; max-width: none !important; }}

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#943339

Hi
Kindly send a temp super user details via Private reply , so i can fix it directly on your site.

[gary1234 Friend gary1234Join date: July 2008Posts: 93Downloads:40Uploads:6 Thanks: 3]

#943375

I have added the login privileges to the thread.

Thanks

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#943492

Hi
I was unable to make changes due the template folder is not writable on your site .

code for the logo should be like below

/* Start of Mobile control of front page logo */
@media (max-width:468px) {.logo img { max-width:200px} }
@media (min-width:992px) {.logo-control .logo-img { display: block; max-width: none !important; }} 
/* End of Mobile control of front page logo */

@media (max-width:768px) { .logo-image img { max-width:250px}}

Kindly remove the previous logo code and add the code above , its working as i tested on your site .

[Author]

Posts