Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • November 16, 2017 at 4:54 pm #877609
    feoleb

    Hello,

    I’d like to make my blog use all of the width of the page rather than being squished together. The menu and logo are fine, but the blog columns and right bar I want to make take up all 100% of the screen. I do have a custom .css section for each page. I dunno what to edit though.

    Thanks,

    Brendon

    November 18, 2017 at 4:07 am #878347
    Nikko

    Hey Brendon,

    Try adding this css code in Quick CSS (located in Enfold > General Styling):

    article.slide-entry.flex_column.post-entry {
    width: 100%;
    text-align: center;
    margin-left: 0 !important;
}

    Hope this helps :)

    Best regards,
    Nikko

    November 18, 2017 at 6:19 pm #878601
    feoleb

    Hello Nikko,

    I tried that but it has changed the style of the blog entries however it has not changed the width of the page.

    Thanks,

    Brendon

    November 18, 2017 at 6:25 pm #878602
    feoleb

    Currently all of the content is squished together into the center of the page. There’s area on the right and area on the left that cannot be used. I want to use that area.

    November 18, 2017 at 9:27 pm #878646
    Mike

    Hi,
    Please try going to Enfold Theme Options > General Layout > Dimensions and changing the Maximum Container width to a higher number.
    Then set the Content + Sidebar width to 100%, and adjust the Content | Sidebar Ratio to suit.
    2017-11-18_142616

    Best regards,
    Mike

    February 14, 2018 at 9:42 pm #912506
    THP Studio

    I had this problem too, drove me crazy. Really surprised there isn’t a simple Enfold setting for a modern, full width blog.

    I got it to work by turning off sidebars, and then adding this code to the custom css:

    @media all {
    #top .fullsize .template-blog .post-title {
        text-align: center;
        font-size: 30px;
        padding: 15px 0;
        max-width: 100%;
        margin: 0 auto;
    }

@media all {
    #top .fullsize .template-blog .post .entry-content-wrapper {
        text-align: justify;
        font-size: 1.15em;
        line-height: 1.7em;
        max-width: 100%;
        margin: 0 auto;
        overflow: visible;
    }
}

@media all {
    #top .fullsize .template-blog .post .entry-content-wrapper > * {
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
    }
}

    You can see it in use here: https://www.microstockman.com/adobe-stock-interview-2018/

    • This reply was modified 6 years, 8 months ago by THP Studio.
    February 15, 2018 at 3:15 am #912584
    Mike

    Hi,

    @THP     Thank you for sharing your solution, and thank you for using Enfold.

    Best regards,
    Mike

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.