Mobile Display Problems

  • Unknown's avatar

    On my phone my blog display has the following problems:
    1. There are white lines at the top and down the left side of my header (also at the bottom of the page on the left. They are just inside the border. It’s like there is a gap between the border and the main body of the header.
    2. The background image loads slowly at the top of the page but does show there, but as I scroll down it fails to load.
    3. The Facebook widget (dark theme) is just a black empty box.
    4. The Follow Me widget at the top of the sidebar is cut off.
    Any solutions?

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    Forgot to add another problem:
    5. Menu color is not the more recent updated one.

  • Unknown's avatar

    I just switched to enable mobile theme and it solved some problems, but not all. Can I use CSS to change the mobile display, specifically cancelling some borders that don’t look as good on the phone?
    Sorry I keep adding to the original question–just realizing the complications when things move to the phone. Thanks.

  • Hi!

    The custom header image, custom header text color, and custom background color and image are honored on up-to-date browsers for modern mobile devices.

    If you have the Custom Design upgrade and use Custom CSS, you can opt to apply custom CSS to the WordPress.com mobile theme. To enable this option, go to Appearance > Customize > CSS and check the “Include this CSS in the Mobile Theme” option. Then use “.mobile-theme” at the beginning of your CSS selectors to target just the mobile theme.

    – Joe

  • Unknown's avatar

    That’s very helpful. I’ll play with that a bit and see if I can solve some of the problems. Others it might not help with though, like the top half of the twitter button being cut off and the facebook widget being a black box with no text. Or the white lines in the header. Any thoughts on those? Also, I solved the problem where the background wasn’t loading fully by changing the background setting in my custom css from “fixed” to “scroll.” But I would much prefer “fixed.” Is there a different way to solve that problem?

  • Hi!

    Writing CSS for mobile phones can be tricky because there are so many different shapes, sizes and software to choose from. What works on one phone will not necessarily work on all of them. Often we end up compromising design for compatibility.

    Have you tried looking for answers in the forums? You might be able to find some who has the same phone and software as you.

    As I mentioned in your other thread, the empty facebook box is caused by the blank page at Facebook.

    Let me know if you have any other questions. :)
    – Joe

  • Unknown's avatar

    OK. I’ll be playing around with this aspect of things, using the great tips you’ve given me. Thanks.

  • The topic ‘Mobile Display Problems’ is closed to new replies.