Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • August 19, 2018 at 12:09 pm #998888
    mirzepapa

    Hi,

    on https://musikzentrale.net/ I am using a formula to book a trial lesson. I would like to have it aligned with content`s right border. I have checked several approaches with avia builder or css, but the result is not exactly what I want it to look like.
    Looking forward for your ideas.

    have a great sunday
    Sebastian

    August 19, 2018 at 7:41 pm #999047
    Victoria

    Hey Sebastian,

    Could you please attach a mockup of what you’re trying to achieve? Or explain a bit more what and how needs to be adjusted.

    Best regards,
    Victoria

    August 19, 2018 at 8:54 pm #999080
    mirzepapa

    Hi Victoria
    thank you for your reply, great to have someone to think along with ;-)

    Here is a mockup of what i want to achieve: move the formula to the right so it aligns with the main menu

    Formula

    Thanks for your kind assistance,
    Sebastian.

    August 20, 2018 at 6:12 am #999172
    Rikard

    Hi Sebastian,

    Thanks for the screenshot. Please try the following in Quick CSS under Enfold->General Styling:

    .home #av_section_1 .container {
    padding: 0 !important;
}

    Best regards,
    Rikard

    August 20, 2018 at 10:22 am #999276
    mirzepapa

    Hi Rikard,

    thanks for your kind assistance, but unfortunately the container is not aligned right. Please find attached a screenshot of the architecture I am using, maybe I have to rethink the design?

    Best Regards, Sebastian

    Formula

    August 20, 2018 at 1:51 pm #999349
    Rikard

    Hi,

    Thanks for the feedback, though the CSS I posted should work, I just verified it. Where exactly are you putting it and are you clearing your browser cache before you check it?

    Best regards,
    Rikard

    August 20, 2018 at 2:02 pm #999359
    mirzepapa

    Hi Rikard
    thanks for coming back to my request. I put the respective code in enfold –> general Styling –> Quick CSS, purged WP Engine Cache, Hummingbird Cache and the browser cache, then open it in a new private window. Is there anything I forgot about the cache? ;-)

    Any idea is welcome.
    Best regards, Sebastian.

    August 20, 2018 at 2:24 pm #999378
    Guenni007

    try this in quick css:

    .page-id-76763 .av-section-color-overlay-wrap .container {
    width: 100%;
    max-width: calc(100% - 100px) !important;
}

    maybe for your setup test different calculation values (the minus px amount)

    • This reply was modified 6 years, 3 months ago by Guenni007.
    August 20, 2018 at 3:01 pm #999401
    Victoria

    Hi mirzepapa,

    Have you tried Guenni007’s solution?

    Best regards,
    Victoria

    August 20, 2018 at 4:07 pm #999436
    mirzepapa

    Hi Victoria, hi Guenni,

    thanks for your help, but unfortunately there is no change in design. I cleared cache several times, closed the browser and opened in a private window,
    Maybe it does not work at all since the formula resides in the 2/5th of a 3/5 + 2/5 styling, that streches only to the content width? If so, I need a new concept for the idea having the formula aligned with the menu.

    Cheers, Sebastian.

    August 21, 2018 at 10:42 am #999731
    Victoria

    Hi Sebastian,

    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, Please try this code isntead.

    
#av_section_1 .container {
    max-width: 100% !important;
    padding: 0 40px;
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    August 21, 2018 at 11:06 am #999753
    mirzepapa

    Hi Victoria,

    awesome, that did the trick. Now the alignment is perfect, thank you so much ;-) Ticket can be closed.

    Best regards to the best support Team,
    Sebastian

    August 21, 2018 at 11:22 am #999760
    Guenni007

    ja – deshalb schrieb ich ja :

    maybe for your setup test different calculation values (the minus px amount)

    .page-id-76763 .av-section-color-overlay-wrap .container {
    width: 100%;
    max-width: 100% !important;
}

    deshalb sind die 100% ohne Abzug ok

    PS : be more selective on your code – this

    #av_section_1 .container {
    max-width: 100% !important;
    padding: 0 40px;
}

    is for all first color-sections on your whole site
    you can see it on “Dozenten” Site etc.

    • This reply was modified 6 years, 3 months ago by Guenni007.
    August 21, 2018 at 11:59 am #999778
    mirzepapa

    Hi Guenni,

    now i see what you mean, thanks for the hint. Now I have combined the two proposals into one, looking like:

    .page-id-76763 .av-section-color-overlay-wrap .container {
    width: 100%;
    max-width: 100% !important;
    padding: 0 40px;
    }

    And it seems to work. I need to develop my code-analysis skills, is there any tool you advice to replace the good, old Firebug?

    Have a nice day, Sebastian.

    August 21, 2018 at 1:51 pm #999822
    Guenni007

    i miss it too – on Mac OS X i got now the firefox developer edition. these tools are included and they’re a good substitute.

    August 21, 2018 at 2:37 pm #999837
    Rikard

    Hi Sebastian,

    Great, so everything is working as it should now? Thanks @guenni007 for helping out.

    I use the inspector in Chrome/Opera/FF Dev and it does the job most of the time :-)

    Best regards,
    Rikard

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