Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • September 24, 2018 at 11:43 pm #1013906
    jscarlett

    I am trying to create a full screen website (boxed layout at 1890px wide) with the contents within 1000px and centered.

    But the contents are over to the left. How do I make the contents centered please so that there is white space either side?

    Thanks

    Jane

    September 25, 2018 at 2:44 pm #1014200
    Ismael

    Hey jscarlett,

    Thank you for using Enfold.

    Did you add this css modification?

    #main .content {
    min-height: 800px;
    max-width: 1200px;
}

    The content container is set to float to the left by default.

    Try this one:

    #main .content {
    min-height: 800px;
    max-width: 1200px;
    margin: 0 auto;
    float: none;
}

    Best regards,
    Ismael

    September 26, 2018 at 12:11 am #1014499
    jscarlett

    Hi Ismael

    Thank you for your reply. I changed the css but it didn’t work.

    Jane

    September 26, 2018 at 3:10 pm #1014771
    Victoria

    Hi Jane,

    Best regards,
    Victoria

    September 26, 2018 at 3:46 pm #1014800
    jscarlett

    Hi Victoria

    On a larger screen size the content is over to the left. It needs to be centered on all screen sizes if possible?

    Thanks

    Jane

    September 27, 2018 at 5:27 am #1015108
    Ismael

    Hi,

    Did you add the css code? I don’t see it in the browser inspector when I inspect the page. Please provide the login details in the private field. We would like to check it.

    Best regards,
    Ismael

    September 27, 2018 at 8:29 am #1015164
    jscarlett

    Hi Ismael

    I added the code but removed it when it did not work. I’ve added it again.

    Here is an admin login.

    Thanks

    Jane

    September 27, 2018 at 8:31 am #1015167
    jscarlett

    Hi here you go…

    September 28, 2018 at 6:46 am #1015593
    Ismael

    Hi,

    Thanks for the update. The content are center aligned when I checked the page. Please purge the browser cache or do a hard refresh prior to checking the page.

    Screenshot: https://imgur.com/a/wqZgJuY

    Best regards,
    Ismael

    September 28, 2018 at 9:08 am #1015642
    jscarlett

    Hi Ismael

    Thanks but the content is stretched across the page and the max-width is ignored. I’ve added an i!mportant but no effect.

    #main .content {
    min-height: 800px;
    max-width: 1200px!important;
    margin: 0 auto;
    float: none;
    }

    Is there a way of limiting the content to within 1200px and centered please?

    Thanks

    Jane

    September 28, 2018 at 6:15 pm #1015837
    Victoria

    Hi Jane,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
@media only screen and (min-width: 1440px) {
  .responsive .container {
    max-width: 1200px;
    margin: 0 auto;
  }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    September 29, 2018 at 10:08 am #1016011
    jscarlett

    Hi Victoria

    Thanks but that makes all content within the restricted width – including the header and socket/footer.

    I was hoping to only restrict everything between the header and socket/footer.

    Is that possible please?

    Thanks

    Jane

    October 1, 2018 at 4:17 am #1016383
    Ismael

    Hi,

    Sorry for the confusion. We moved the masonry element inside a color section, applied a unique Section ID and then added the following css code to limit the width of that particular section’s container.

    #projects-section .container {
    max-width: 1200px;
}

    Best regards,
    Ismael

    October 1, 2018 at 2:10 pm #1016635
    jscarlett

    Hi Ismael

    Thank you – that works.

    So do I create a Section Id for each page?

    Thanks

    Jane

    October 2, 2018 at 4:23 am #1016843
    Ismael

    Hi,

    You can use the same Section ID if the section is on a different page.

    Best regards,
    Ismael

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