Skip to content
Public Ticket #10700

Mobile ease of use issues on site

Conversation thread

PenciDesign replied

Staff Reply

Hi,

With your issues:

1/ "Text is to small" & "Clickable elements are too close" - please try add more this code to Customize > Custom CSS to fix it:

@media only screen and (max-width: 479px) {
ul.penci-topbar-menu > li a, div.penci-topbar-menu > ul > li a, .widget ul.side-newsfeed li .side-item .side-item-text .side-item-meta{ font-size: 14px; }
body, p{ font-size: 16px; }
#top-search > a > i, #navigation .button-menu-mobile > i{ line-height: inherit; }
.penci-menuhbg-wapper{ display: none; }
.widget #searchform input.search-input, .penci-sidebar-content .widget #searchform input.search-input, #footer-copyright *, .penci-topbar-social a{ font-size: 15px; }
.widget-social.show-text a span{ font-size: 15px !important; }
.footer-instagram h4.footer-instagram-title span, .item-related span.date{ font-size: 14px; }
ul.footer-socials li, .author-content .author-social{ margin-right: 20px; }
.penci-topbar-social a, .post-share a{ margin-left: 20px; }
.post-share{ margin-top: 12px; }
.penci-headline{ display: table; }
.wp-caption p.wp-caption-text, .penci-featured-caption{ font-size: 15px; }
.post-pagination h5{ font-size: 16px; }
.cat>a.penci-cat-name, .penci-grid li .item .cat a, .penci-masonry .item-masonry .cat a,
.penci-container-inside.penci-breadcrumb span, .penci-container-inside.penci-breadcrumb span a, .container.penci-breadcrumb span, .container.penci-breadcrumb span a,
#sidebar-nav .menu li a,
.penci-pagination a, .penci-pagination .disable-url {    font-size: 14px;
}
.main-nav-social a{ font-size: 16px; margin-right: 17px; }
.header-social a i{ font-size: 16px; margin-right: 7px; }
.featured-style-23 .penci-item-1 .penci-mag-featured-content h3 a, .featured-style-23 .penci-item-2 .penci-mag-featured-content h3 a, .featured-style-23 .penci-item-3 .penci-mag-featured-content h3 a, .featured-style-23 .penci-item-4 .penci-mag-featured-content h3 a, .featured-style-23 .penci-item-5 .penci-mag-featured-content h3 a, .featured-style-23 .penci-item-0 .penci-mag-featured-content h3 a{ font-size: 15px; }
}

2/ For "Content wider than screen" I didn't see any issue on mobile. I've tested your site on 3 different phones and I didn't see any page has this issue. This issue caused by you have a page has more width with the screen of mobile.

Best Regards,

PenciDesign

Percasedescubrase started the conversation

Conversation Start

Hello,

Google is detecting the following issues with the theme on mobile devices:

  • Text too small to read
  • Clickable elements are too close
  • Content wider than screen

How could I solve?

Thanks

Want to join this conversation or access attachments? Sign in first.