Support » Theme: Fictive » Responsive Design issue with Theme, Post goes Down in some Screen sizes.

  • Resolved arunx

    (@arunx)


    Hi i’m using Fictive theme with my own child theme, Everything Works perfect with no issue. But Problem is with Theme responsiveness, because theme doesn’t change properly in some Screen sizes. I have tested on Nexus 7 tab and Samsung Tab and it won’t shows properly.
    Here Screenshot of problem with theme on my blog

    Screenshot

    And My Blog Link

    MakeYouAdmin

    In Most of devices every thing works fine but for some screen size above Problem Happens

    Please Help me.

Viewing 9 replies - 1 through 9 (of 9 total)
  • Hello,

    You need to try this in your Custom CSS for achieving that:

    @media screen and (min-width: 800px) {
    .hfeed.site {
        max-width: 1200px;
        width: 96%;
    }
    header.site-header {
        width: 23%;
    }
    #content.site-content {
        width: 76%;
    }}

    Hope that helps. Thank you.

    Thread Starter arunx

    (@arunx)

    Thank you Jitendra that fixed my issue, but after that i’m see one more issue. When i see my site in tablet the Blog Name overlaps with Post. Please could you suggest something.

    Thank you

    Hello,

    As you have used a text there, so the fonts go beyond the container. If you just use a space there then it also fixes the issue. Otherwise you can try this in your Custom CSS so that the remaining text go to the next line:

    .site-title > a {
        width: 100%;
        word-wrap: break-word;
    }

    Please try adding this and let me know if you are comfortable with that or not? If not then please update with the above CSS mentioned in my first reply so that I can help you with another solution.

    Thank you.

    Thread Starter arunx

    (@arunx)

    Yes Jitendra i have added the first CSS you have given and it is live now.. you can check and suggest me what should i do , for site to look perfect.

    Thank you for your precious time.

    Hello,

    Instead of

    .site-title > a {
        width: 100%;
        word-wrap: break-word;
    }

    try this instead in your Custom CSS for achieving that:

    @media screen and (min-width: 800px) and (max-width: 1024px)
    .site-title > a {
        font-size: 18px;
    }}

    Hope that helps. Thank you.

    Thread Starter arunx

    (@arunx)

    Added
    @media screen and (min-width: 800px) and (max-width: 1024px)
    .site-title > a {
    font-size: 18px;
    }}
    to my child theme style.css file but problem not fixed.

    Thank you Jitendra

    Hello,

    Sorry, there was a missing { in the above code.

    You can try this:

    @media screen and (min-width: 800px) and (max-width: 1024px){
    .site-title > a {
        font-size: 18px;
    }}

    Thank you.

    Thread Starter arunx

    (@arunx)

    Thank you … Thank you It resolved my all issue and everything looks perfect..

    Thank you for your efforts and time πŸ™‚

    Welcome. πŸ™‚

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Responsive Design issue with Theme, Post goes Down in some Screen sizes.’ is closed to new replies.