Tagged: , ,

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • January 25, 2016 at 11:48 am #83658
    CrystalClear
    Participant

    Hi Sakin, I hope you are well.

    This an issue that appears to have come up recently, probably in the last few weeks. The only change I can think of that happened on the sites was that WordPress seemed to have been automatically updated to 4.4.1. So I don’t know if that’s the cause or not.

    In any case, the issue is that, all of a sudden (it was functioning fine before), when I look at my homepage and also my blog page on an iPhone (iPhone 5, iOS 9.2), those pages are not fitting properly to the screen. They are too small — the width is not wide enough to fit the screen as it is meant to. The other pages appear to be showing properly, it seems to be only affecting the homepage and the blog page, and to different degrees. It has the same issue on both Safari and Chrome. (I have not tested this on other phones, but it does work properly on iPad.) How do we remedy this?

    I will email you screenshots and links.

    Thank you,

    January 25, 2016 at 1:04 pm #83670
    Sakin
    Keymaster

    @Consciousness: It’s because of long dashes ______________________________________________________________________ without space. So, you can replace that with <hr/> code.

    If you don’t want to replace that with <hr/>, then you need to go to “Appearance => Theme Options => Custom CSS” box and then remove the following css

    #content article {
	word-wrap: normal;
	-webkit-hyphens: none;
	-moz-hyphens: none;
	hyphens: none;	
}
    January 25, 2016 at 11:00 pm #83736
    CrystalClear
    Participant

    Hi, thank you. That #content piece in the Custom CSS is stopping so many words from hyphenating. So if I remove it, tons of words get hyphenated, which is undesirable. So I put in <hr/>. Do you know of how I can make the <hr/> thicker/bolder? Is there something I can add to the Theme Options/Custom CSS for that? (I’d also prefer to not have so much space around the <hr/> — it adds more space (between above/below text) than ________ and doesn’t seem to respond to “line break”.)

    The blog page ( [mysite].com/posts – (I emailed you the link) is still doing this (not fitting to screen), though not as much, and I don’t see any _______ on there, so may be for a different reason. It doesn’t matter much since it is only contracting slightly (per screenshot in email), but does there happen to be an easy remedy for it?

    Thank you and all the best.

    January 26, 2016 at 9:27 pm #83795
    Sakin
    Keymaster

    @Consciousness: You can control: color, height and margin button of that <hr/> by adding custom css. In the following css, you can change color, height and margin button as per your need and then add it in your custom css box:

    hr {
    background-color: #ccc;
    height: 1px;
    margin-bottom: 2em;
}

    Did you refresh your browser and check in. As sometime, there might be cache issue. I don’t see issue in my mobile.

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘home & blog pages not fitting to screen in mobile’ is closed to new replies.