Okay
  Public Ticket #1031396
Questions on styling
Closed

Comments

  •  2
    Rcpinnell started the conversation

    Hi

    I realise these two questions are possibly customisation questions, but I will ask them anyway as they are not huge changes!

    1. Is there any simple way with Custom CSS to make the main body text on posts/pages a little wider. I like the width of the right hand column that contains the meta data but I would prefer the left hand column to be about half the width. Can this be done easily? I don't mind paying a small fee if necessary.

    2. On the blog Category pages, at the top of the page the category title appears, but then directly below it you get the following message: "You are currently browsing posts of the "xxxxx" category." This second line seems unnecessary to me and clutters up the minimal look of the design. Is there a way it can be hidden with simple CSS?


    Many thanks in advance, and thank you for such a simple, clean piece of work

    Richard

  •  291
    Paul replied

    Hi Richard,

    Thanks for the purchase! I am happy to hear you like the theme!

    Regarding your questions:

    1. It would be a bit complicated since most areas are calculated in percentage to align with the design, and adjusting one will affect another. But you can try using this custom CSS to manually adjust the content width:

    .no-image .post-excerpt, 
    .search-results .post-excerpt, 
    .single .post-content, 
    .page .post-content {
        width: 70%;
    }
    .page .post-content-container, 
    .single .post-content-container, 
    .blog-list .post-content-container.no-image, 
    .search-results .post-content-container {
        margin-left: 10%;
    }
    .blog-list .no-image .post-meta-wrapper, 
    .single-post .post-meta-wrapper {
        margin-left: 8%;
        width: 16%;
    }
    @media only screen and (max-width: 950px) {
        .page .post-content-container, 
        .single .post-content-container, 
        .blog-list .post-content-container.no-image, 
        .search-results .post-content-container {
            margin: auto;
        }
        .no-image .post-excerpt, 
        .search-results .post-excerpt, 
        .single .post-content, 
        .page .post-content {
            float: none;
            width: auto;
        }
        .blog-list .no-image .post-meta-wrapper, 
        .single-post .post-meta-wrapper {
            margin: auto;
            width: auto;
        }
    }
    


    2. Yes, you can apply this custom CSS to hide that:

    .top-section .post-content {
        display: none;
    }
    

    If you would also like to use custom CSS for other elements, I would recommend Developer Tools on Chrome or Firebug on Firefox to inspect the elements on the page. Then you will know which CSS selector to adjust. (More info: https://uxbarn.com/inspecting-elements-developer-tools/ )

    Hope this helps!

    Regards,
    Paul

  •  2
    Rcpinnell replied

    That's really helpful thank you Paul. Brilliant support.

  •  291
    Paul replied

    You're welcome, Richard!