Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1292903

    Hi guys,

    I have this page >>> https://www.viverelondra.com/lista-lavori-disponibili

    I would like to make it narrower like in this example >>> https://www.screencast.com/t/TO6vaPhQiEXV
    I obtained this with “inspect element” using the code

        width: 70%;
        margin-left: 15%;

    However I do not know how to implement it in the CSS.

    Could you please give me a hint?

    thanks,
    Marco

    #1293186

    Hey marcoabis81,

    Thank you for the inquiry.

    You can actually adjust the maximum container width in the Enfold > General Layout > Dimensions panel. Look for the Maximum Container width field and set the width in pixel, or in percentage, which is relative to the browser viewport or the screen resolution.

    Best regards,
    Ismael

    #1293210

    Hi Ismael,
    Yes correct.

    But if I chance the general settings I will change all site.

    How can I make narrow only one single page?

    Thanks

    #1293453

    Hi,

    Thank you for the update.

    If you want to change the maximum width of a single page, try to use this css code.

    .page-id-24740 #narrow-page .container {
        max-width: 50%;
        width: 50%;
    }

    24740 in the selector above is the page ID of the lista-lavori-disponibili page.

    Best regards,
    Ismael

    #1293460

    Amazing, wonderful, thank you.

    Did you make narrow the whole page or only the color section called narrow-page?

    thank you
    Marco

    #1293741

    Hi Marco,

    The CSS which Ismael posted targets the ID of a section, if you want it to apply to all containers on the page, then please try this CSS instead:

    .page-id-24740 .container {
        max-width: 50%;
        width: 50%;
    }

    Best regards,
    Rikard

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.