using responsive wordpress theme but content is cut off on left side in mobile versions

I made a wordpress site using the responsive theme “hueman”.
For the integration of the content I used the plugin “pixgridder” (don`t know if that is relevant)
For testing the site an all devices I use this tool: quirktools.com/screenfly

My site is: http://www.traumbad-muenchen.de
When testing the site http://traumbad-muenchen.de/portfolio/ in the mentioned tool above I can see that for apple I phone 5 the content is cut off on the left side while the page titel is displayed correctly.

Read More

I tried to find out the problem with firebug and so on but can`t find a way to make the content appeare like the page titel does that means not do be cut off.

I tried to play around with different settings redarding padding and margin but whenever I do this the content is mooved to the middle also on the desktop versions so that these versions look stupid.

What I want to achieve is that the edge of the content always starts exactly where the edge of the page titel does. I don`t have any problem displaying the page title.

Would be so thankful if anybody could help me.

Thanks a lot in advance

Related posts

Leave a Reply

2 comments

  1. The problem occurs because there is no padding.

    You can overcome this problem by adding a padding-left in your responsive.css on line 171.

    Change:

    .entry { font-size: 15px; }
    

    to

    .entry { font-size: 15px; padding-left:10px;}
    
  2. In my case, I had to add padding to the span settings. One easy solution would be to load the website on a ‘website responsive testing’ site and then try to solve your issue by using the ‘inspect element’ on your browser.