menu button and logo size – mobile version

[ilarianegrini]

Hi there,
I would like to fix 2 problems on mobile version.

1. I have set up only a top menu and I would like not to show the menu icon. How can I disable it?
Please see uploaded file: menu-red-arrow.png.
Using Internet Explorer, Firefox and Safari (desktop version), this menu button generates some extra blank space before or after the logo (depending on resolutions). 🙁

2. I would like to show on mobiles the logo I uploaded (1250px x 332 px) fully extended, when the screen is rotated. How can I do this? This issue is related to the number 2 I wrote?
Please see header-fulllenght.png file.

The installed theme version is 2.1.1.

Thank you in advance for your help.

Attachments:

You must be logged in to view attached files.

[ilarianegrini]

here is the second file

Attachments:

You must be logged in to view attached files.

[Kamal]

Hi,
Can you please give me the link to your site so that I can check and test it? and do you want to apply the large logo on mobile horizontal position only or in both horizontal and vertical position?
Thanks,
Kamal

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[ilarianegrini]

This reply has been set as private.

[Kamal]

Hi,
Thank you very much for your patience and assistance. I have found solution to your problems. I Please have a look at them.
For solving your problems, Please add the following code to the stylesheet of KLEO child theme.you can find it From Appearance>Editor>style.css. After adding them, please save your file and refresh the page. and you can also clear browser cache and cookies and other data to test properly. Then your problem should be fixed.
Code to solve no 1 problem.

COPY CODE

.kleo-mobile-switch {
display: none;
}

Code to solve problem 2.

COPY CODE

/*------
Smartphones (landscape) you can change 321 to 320 to apply this change on both portrait and landscape
----- */
@media only screen 
and (min-device-width : 321px) 
and (max-device-width : 480px) {
.container {
 padding-left: 0 !important;
 padding-right: 0 !important;
}

}

Please let me know if this works for you. I have tested and It works for me. You can see the screenshot. Please ask me anytime if you have any more question.
Thanks,
Kamal

NB: white space on left and right of the header/full site is not the window. I have added highlight marker so It looks like that. Please see the second screenshot. thanks.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Attachments:

You must be logged in to view attached files.

[ilarianegrini]

all changes done.

thank you so much!

[Kamal]

Hi, You are most welcome. I am marking it resolved then. Thanks.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[Author]

Posts