Site displays single character per line on mobile

  • Hi there – I inherited the management of 5 blogs from a former coworker who is no longer at our company and unavailable to answer my questions when things go wrong. :/

    Our site, blog.artisancraftedhome.com is not displaying correctly on mobile browsers – it shows single characters per line, and is not fit to the screen, etc. It seems to be fine on my desktop browsers, Chrome, IE, Firefox, and Safari. It displays better if you click the Reader Mode button on an iPhone, but I’d say the majority of our mobile readers don’t know that button exists so I need it to display correctly on the default view.

    We have 4 other blog sites that were set up the same way, but are displaying just fine on mobile – i.e. blog.coppersinksonline.com so I cannot find what may be different on the ACH blog that is causing it to display so poorly on mobile.

    Please help! Thank you!

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter AMcInerney

    (@amcinerney)

    Messed up the link to our site somehow apparently, no wonder no replies…. Site is: blog.artisancraftedhome.com

    There are numerous issues with displaying this site on narrow screens. I don’t think it was intended that it would be responsive when it was customised. Adding responsiveness afterwards is non-trivial. If responsiveness is critical to you, consider looking for a responsive theme.

    Hopefully this custom css will address the worst parts of the display on narrow screens if you are not too fussy. Check for adverse effects on other pages.

    #primary
{float:left; max-width:524px}

.sidebar .entry-header,
.sidebar .entry-content
{padding-right:0}

footer {clear:both}

@media only screen and (max-width:860px) {
  #primary {margin-top:260px}
}
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Site displays single character per line on mobile’ is closed to new replies.