Tagged: , , , ,

Viewing 21 posts - 1 through 21 (of 21 total)
  • Author
    Posts
  • #868428

    Hi guys!

    I’m trying to limit the width of my entire website to 1440px.

    In the General Layout section the max width is already set as 1440px + I tried to add the following code to the Quick CSS and clear cache of my browser but it’s still not working…

    .responsive .container {
       max-width: 100%;
    }

    Any guess to solve my problem?

    Cheers,

    Demaup
    Website link : https://ergosolutions-transitions.ovh/

    #868434

    Hey Demaup,

    Have you tried changing max-width to

    1440px!important;

    Best regards,
    Jordan Shannon

    #868472

    Hey Jordan,

    I tried but it isn’t working unfortunately.

    #868749

    Hi,

    Do you have any other custom css that may be prevent that css from running? Also, try disabling all other active plugins to ensure that there is no other style conflicts.

    Best regards,
    Jordan Shannon

    #869249

    Hi Jordan,

    I don’t have any custom CSS that may prevent the max width of the container.
    I tried to disable all the plugin (except Zen Menu Logic, because if I do this I will have to remake all the work) but nothing happened.

    #869704

    Hi,

    Please post us your login credentials (in the “private data” field), so we can take a look at your backend.

    1. Install and activate ” Temporary Login Without Password “.
    2. Go to ” Users > Temporary Logins ” on the left-side menu.
    3. Click ” Create New “.
    4. Add the email address for the account ( you can use (Email address hidden if logged out) ), as well as the ” Role ” making that the highest possible and the expiry about four days
      ( do be sure that we have enough time to debug ).
    5. Click ” Submit “.
    6. You’ll now have a temporary account. Please provide us here in the private section the URL, so we can login and help you out.

    When your issue is fixed, you can always remove the plugin!
    If you prefer to not use the plugin, you can manually create a admin user and post the login credentials in the “private data” field.

    Best regards,
    Yigit

    #870852

    Hi Yigit!

    The URL is in the private content.

    Thanks for your help and sorry for the late response.

    Demaup

    #870855

    Hi,

    Container width is currently 1440px. I attached a screenshot in private content field.
    Can you please post a screenshot and show the changes you would like to make? You can upload your screenshots on imgur.com or Dropbox public folder and post the links here.

    Best regards,
    Yigit

    #870870

    Thanks for you quick answer!

    I would like to set the max width to 1440px for the entire website (not only the container but also the main menu, etc…) and then if the website is on a very large screen (1900px for example) the website will be on the middle and sides will show background color. Is it possible?

    #870911

    Hi,

    I went to Enfold theme options > General Layout and switched to boxed layout. I believe that is what you meant. Please review your website :)

    Best regards,
    Yigit

    #871014

    Hi,

    Unfortunately this is not what I meant. If you watch the website on a large screen he will be “boxed” but still be really large.

    What I want is more what is working on this website for example : https://laboitenumerique.fr/
    If you extend your tab width, the responsiveness of the website will extend until -more or less- 1400px. And then all elements stop growing and stay on a 1400px container basis.

    The boxed layout just put sides of color but if you extend your navigation tab on my website, the website will never stop “growing”.

    #872375

    Hi,

    I’m sorry but we don’t understand what you’re trying to do. Please provide a screenshot of the changes that you’d like to make on imgur or dropbox.

    Best regards,
    Ismael

    #876574

    Hi Ismael,

    No worries it’s just that it is difficult for me to explain, sorry.

    What I want is to have a responsive website until a 1440px width screen. When a screen is bigger that 1440px I would like to have a “boxed” website with sides appearing and the website inside a 1440px container. Is it maybe easier to understand? Is it possible?

    Cheers and thanks,

    Demaup

    #877352

    Hi,

    Thank you for the update.

    When a screen is bigger that 1440px I would like to have a “boxed” website with sides appearing and the website inside a 1440px container.

    I’m sorry but that’s not possible by default. You have to choose between “boxed” or “stretched” layout but you CAN’T have both. Please hire a freelance developer or contact our partner, Codeable.

    // https://kriesi.at/contact/customization

    Best regards,
    Ismael

    #877706

    Thank for your response!

    I understand but the thing I don’t get is: I have a friend who used enfold for his website (https://laboitenumerique.fr/) and he did nothing special and this is working as the way I ask.

    His website on a 13″ screen: https://imgur.com/a/wCGjR
    His website on a 15″ screen: https://imgur.com/a/uZlya

    The only different plugin I’m using is Zen Menu Logic. Do you think a “conflict” can exist between Enfold and the plugin?

    #877961

    Hi,

    There’s a lot of grid row element on your site which is a full width element while the other site is using the tab section element.

    Best regards,
    Ismael

    #878234

    Understood! Thanks Ismael

    For info I found an alternate solution:
    I set custom CSS for Elements and I had this code to the custom CSS

    .custom-width-element {
        max-width: 1360px !important;
    }
    #header {
        max-width: 1360px !important;
    }
    #footer {
        max-width: 1360px !important;
    }

    And then when someone see the website on a screen larger than 1360px is not responsive.

    Last question: with this solution the website stay on the left side of the screen (when a screen > 1360px). Any solution to put it in the middle of the screen? I put a link in private content of the page where I implement this solution.

    #878283

    Update:

    I added auto margin:

    .largeur-max {
        max-width: 1360px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    #header {
        max-width: 1360px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    #footer {
        max-width: 1360px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    It’s working perfectly for all elements except the header and the color section.
    Any guess how to solve it?

    Example page in private section.

    #879453

    Hi,

    Thank you for the update.

    Please add the following css code.

    .html_header_top.html_header_transparency #header {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
    }
    
    .avia-section {
        margin: 0 auto;
        position: relative;
        float: none;
    }

    Best regards,
    Ismael

    #879824

    This is working perfectly! Thanks Ismael for your help: you’re a genius!

    Demaup

    #880065

    Hi,

    No problem. Please feel free to open a new thread if you need anything else. :D

    Best regards,
    Ismael

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

The topic ‘Max width for the entire website not working’ is closed to new replies.