Tagged: 

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • March 2, 2017 at 2:12 pm #754350
    Johan Lindvall

    Hi,

    I´m using full width button on multiple pages and now I experience that it doesn´t go full width.
    I´ve read that other had the same problem an I´d tried to put it outside the color section, add some whitespace above it, having the theme updated etc etc, but nothing works.
    The funny thing is that it works on some pages and there is no difference on how the pages are built. I´m using multiple languages and at the swedish and english page it works, but not on the german one.
    http://www.sudersand.se/vara-boenden/hotell/ is okey.
    http://www.sudersand.se/de/unsere-unterkuenfte/hotel/ is not okey.

    Can you please help?

    March 2, 2017 at 4:25 pm #754404
    Vinay

    Hey Johan,

    It appears you got this one sorted? I checked the link on which you have mentioned not okey and the button appears full width.

    If you have any issue

    1. Please enable the custom css class field: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/
    2. Give the button element a class name of “btn-fullwidth”.
    3. Add this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    /* Full width button */

.btn-fullwidth .avia-button {
width: 100%;
font-size:30px; /* Make font large */
}

    Best regards,
    Vinay

    March 2, 2017 at 4:33 pm #754408
    Johan Lindvall

    Hello Vinay!

    No, that is not how I want it to look like… If you see the other link the button is over the entire screen.
    I want it like this: http://www.sudersand.se/vara-boenden/hotell/

    That is how it looks like on almost every page, but on a few it appears like on picture you pasted.
    Do you have any idea why?

    I will look in to the tip you gave. =)

    Regards Johan

    March 4, 2017 at 6:39 am #755488
    Rikard

    Hi Johan,

    Please send us a temporary admin login and login URL so that we can have a closer look. You can post the details in the Private Content section of your reply.

    Best regards,
    Rikard

    March 8, 2017 at 10:50 am #757677
    Johan Lindvall

    Hi again!

    Apparently the button looked great for another person that has helped me before, but when he logged in, everything changed for him aswell. The button changed to a box-like version and some other problems appeared aswell.
    Some separators has disappeared and a few sections (not colorsections) has merged into same colors and so on.
    But please take a look at the button to begin with. =)

    I´ll give you access to the site, so you can take a look.

    Thanks!

    March 13, 2017 at 10:05 am #759895
    Johan Lindvall

    Hi again,

    have you had the opportunity to check it out?

    Regards Johan

    March 14, 2017 at 4:50 am #760402
    Nikko

    Hi,

    Sorry for the late response. I have added this css code in Enfold Child > General Styling (in German):

    #main > .container_wrap_first.fullsize > .container {
    max-width: 100%;
    padding: 0;
}

#main > .container_wrap_first.fullsize > .container > .av-content-full {
    padding: 0;
}

    Let us know if this fixes all the issue :)

    Best regards,
    Nikko

    March 14, 2017 at 6:30 am #760447
    Johan Lindvall

    Hi,

    Sorry, but that made just the entire site go full width. All containers, sections and everything.
    And if I check the hotel-page from a “not logged in” browser, everything has disappeared before the full width button at that particular hotel-page.

    Hotel

    Regards Johan

    March 15, 2017 at 1:38 pm #761409
    Yigit

    Hi,

    That was because you placed your button inside a Grid Row element. I edited your page and move it out of the container.
    Fullwidth Button elements takes the full width of the container its contained in.
    Please review your website now

    Best regards,
    Yigit

    March 15, 2017 at 1:43 pm #761411
    Johan Lindvall

    Yes, I know, but i placed in a grid row for about one hour ago because I was tired of how it looked otherwise. It looked better in a grid row.
    But the weird thing is now: when I look at the button (just now), it looks perfect. (I took away the CSS you´ve put in the quick css bu the way).
    It didnt look like that before. Seems like it has its free will and does as it pleases…
    If you look at this page, it looks boxed again. Can you explain it for me? =)

    Reihenhäuser

    And I already know that it takes the width of its container, but I dont use containers on this button.

    Regards Johan

    March 19, 2017 at 7:58 am #763110
    Ismael

    Hey!

    I’m not sure what’s going on in your installation. The builder automatically wraps the button inside a color section markup. To work around the issue, we move the button inside a color section, applied a custom css class attribute to it then added the following css code in the Quick CSS field.

    .full-width-section .container {
  width: 100% !important; max-width: 100% !important; padding: 0; margin: 0;
}

.full-width-section {
   min-height: 1px;
}

    Regards,
    Ismael

    March 19, 2017 at 7:04 pm #763284
    Johan Lindvall

    Thanks!
    It seems to be working!

    But you mentioned that my builder does things on its own. I´ve noticed that in other places as well (as described above), do you have any idea why it does that? Something isn´t right.
    Is there somewhere I should look for problems? Anything a update would fix?

    Regards Johan

    March 20, 2017 at 6:46 am #763500
    Ismael

    Hi!

    This is actually a minor glitch in the builder but you don’t have to worry because it’s very easy to fix and it’s not going to occur n every pages. We can’t define what’s causing the issue because it seems to occur if a combination of elements is in place. If it happens again, just let us know or follow our suggestion above to fix it.

    Cheers!
    Ismael

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