- This topic has 4 replies, 2 voices, and was last updated 3 years, 12 months ago by
Skandha.
-
AuthorPosts
-
September 9, 2020 at 11:07 pm #258656
nitani10
ParticipantHello,
My website (https://project555.org) via pc looks generally like how I wanted it to look. However, it has severe issues with my galaxy s10e where half of the page is cut off and zooming out just shows gray space matter. The issues looks differently in different pages, but it is the worst on the homepage (see examples below)Screenshot example 1 – homepage
Screenshot example 2 – homepage
The weird part about all of this is that it looks differently depending on the device. Someone else I know accessed the website via their apple device and while some lettering was cut off – it was not neerly as bad as how it appears on my own galaxy s10e.
Please let me know what I should do!
Additional Context
1) I have placed various css codes throghout the site which I’ve pasted below this section
2) I deleted some php code – specifically in the functions.php section (i.e. the scrollbar in the homepage)
3) I am using nearly 40 plugins and would be happy to share their names if that helps!I really appreciate any and all help in fixing this issue!!
CSS Code in the Customizer section
.site-navigation a { color: #f23456 !important; } #page { margin-left: auto; margin-right: auto; } #content { padding-top: 0; padding-bottom: 0; } #content .entry-header { display: none; } .site-content { margin-top: -28px; } .site-info { display: none } .page-id-3892 .top_bar { display: none; } page-id-3892 .footer_bar { display: none; } /* Decrease Header Height */ .sticky-header .site-content { padding-top: 55px !important; } /* Decrease Footer Height */ .site-footer { padding-bottom: 0.5em; padding-top: 0.5em; } /* Widget */ #tertiary .wrapper .widget-column > .widget{ max-height: 1vh; padding-top: 0; } #tertiary .wrapper .widget-column { max-height: 0; padding-top: 0; } #text-2 { height: 1vh; } #tertiary { background-color: #2b2b2b; height: 14vh; } #tertiary, #tertiary .widget { padding: 0; }
CSS Code in Yellow Pencil
Global
.fullscreen{ overflow: hidden; } /* Link */ #menu-top-navigation > .menu-item > a{ font-weight:600; } /* Link */ #menu-top-navigation .sub-menu a{ font-weight:600; } /* Site generator */ #site-generator{ display:none; } /* Entry Footer */ #main .hentry footer{ display:none; } #page{ overflow-x:visible; }
single page (homepage)
/* Division */ .n2-ss-slide-19 .n2-ss-layer .n2-ss-section-main-content{ left:0px; top:-64px; } /* Link */ #menu-top-navigation .sub-menu a{ font-weight:600; } /* Heading */ #page-titlebar h1{ display:none; } .ht-main-header{ display: none; } /* Page titlebar */ #page-titlebar{ display:none; } /* Column 3/12 */ #sidebar-primary{ display:none; } /* Column 9/12 */ #main{ padding-top:0px; padding-bottom:0px; } /* Site generator */ #site-generator{ display:none; } /* Tertiary */ #tertiary{ margin-bottom: 0px; } /* Entry Footer */ #main .hentry footer{ display:none; } #colophon{ min-width:1600px; max-height:0px; box-sizing:content-box; min-height:0px; margin-left:-40px; bottom:28px; }
September 10, 2020 at 1:58 am #258690Skandha
Participant@nitani10: Hello there,
This may be due to the plugins you are using. Can you please deactivate all your plugins and check your site again?Kind Regards,
SkandhaSeptember 11, 2020 at 12:19 am #258794nitani10
Participant@skandha: so it likely is a plugin issue – I jusrt disactivated all of them and the mobile system no longer had that issue. I tried activiating one at a time but the phone version took over 10 minutes for one of the plugins to reappear as opposed to the pc version which was much quicker.
If I share the list of plugins, would you be able to check on your end which one might be causing this issue? I’m also happy to give temporary admin access if that helps.
Here is the list of plugins: https://nitan.neocities.org/plugins.html
Thank you in advance for all of your time and help!
Nitan
September 11, 2020 at 12:38 am #258795nitani10
ParticipantUPDATE – I used a Caching plugin to quickly see the changes on my phone and computer. It’s the yellow pencil plugin which leads me to believe that it’s the code that I had specifically put into it. I took out the CSS code from it that was global and put it on the customizer section of the website.
Now the issue (which I fixed with the yellow pencil plugin) is the gynormous footer that appears in the homepage. Besides the homepage, the footer also does not extend fully from right to left on all pages (i.e. the About Us page or the resource hub page). What is the universal CSS code that I can use to make the footer identical on all pages and look like the “contact us” page?
My website domain is project555.org
Thank you!!
September 11, 2020 at 5:31 am #258824Skandha
Participant@nitani10: Hello there,
The footer#colophon div seems to be inside #content div in other pages whereas on the Contact Us page footer#colophon div is outside #content div and that is how it should be. I think the footer issue maybe due to the smart slider plugin you are using.Kind Regards,
Skandha -
AuthorPosts
- The topic ‘Mobile Responsiveness Issues – Galaxy S10e’ is closed to new replies.