Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #7508
    jocatman
    Member

    Hi .  I have added an image to my header, but it is not behaving in a responsive manner.  Is there code I an use to control the image?

    Also, I’d like to reduce the paragraph spacing on the body text for pages and blogs.

    http://www.onedivinenation.org

    Thanks,

    Joe

    #7529
    Sakin
    Keymaster

    @jocatman: I can see the header image is responding to small size. Your header image is small so it is responding only after screensize below 700px. You can scroll down your browser and check it.

    To reduce the space on the body text of pages and blogs, you have to change the css for all responsive screen. So, I don’t recommend it.

    If you ad the following CSS in “Appearance => Theme Options => Custom CSS” box, it will reduce for all screen. So, be aware of this
    `p { margin-bottom: 30px; }`

    If you want to change for different screen size then add individually to all these sizes.
    `

    @media
    screen and (min-width: 1190px) { p { margin-bottom: 40px; } }

    @media
    screen and (max-width: 1060px) { p { margin-bottom: 20px;} }

    @media
    screen and (max-width: 960px) { }

    @media
    screen and (max-width: 767px) { }

    @media
    screen and (max-width: 480px) { }

    @media
    screen and (max-width: 320px) { }
    `

    #7539
    jocatman
    Member

    Yes, sorry, its not the header image that I am concerned about; its the “Request a Family & Friends Beta Account” banner image.  It will break to the next line on smaller resolutions, but it does not resize.  Actually, what I would like to do is hide the banner on smaller resolutions so it doesn’t look bad on mobile version of site, and lower resolutions.  Is that possible?

    Thank you for the code on the p margin, I will experiment with just the bottom margin.

    Joe

    #7540
    jocatman
    Member

    Sorry, one more thing.  I took used your tip for setting up a Blog category to set up that page in a Custom Menu.  It works well, thanks.  However, is there a way to hide  this display at the top of the post?  http://onedivinenation.org/category/blog/
    Category Archives: Blog

    #7552
    Sakin
    Keymaster

    @jocatman: the header image that I am concerned about; its the “Request a Family & Friends Beta Account” banner image. It will break to the next line on smaller resolutions, but it does not resize. Actually, what I would like to do is hide the banner on smaller resolutions so it doesn’t look bad on mobile version of site, and lower resolutions. Is that possible?
    — To hide the banner Request a Family and Friends Beta account banner in small screens. Just add the following CSS in “Appearance => Theme Options => Custom CSS” box.
    `@media screen and (max-width: 1060px) { #header-right { display: none; } }`

    — If you want to make your banner stay in left always. then instead of hiding add the following CSS in “Appearance => Theme Options => Custom CSS” box.
    `
    #header-left { width: 75%; }
    #header-right { width: 20%; }
    #header-right .widget { width: 100%; }
    `

    Is there a way to hide this display at the top of the post? http://onedivinenation.org/category/blog/ Category Archives: Blog
    — Just add the following css in “Appearance => Theme Options => Custom CSS” box.
    `.category .page-header { display: none; }`

    #7559
    jocatman
    Member

    Both work great, thanks!

Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Right Header Sidebar & Paragraph Spacing’ is closed to new replies.