Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • March 20, 2017 at 6:59 pm #763746
    artisforever

    Hello,

    I have a “survey-monkey” survey I’m trying to fit into one of my av._one_fifth elements. Is there a way to maximize the available width of that particular column? It looks like there is some space to utilize some of the potential room for the survey, which at a min, is 300px. Since that column is

    Using the page below, is there a work around for the column on the right to utilize more of it’s potential width?

    I also attached a screenshot of chrome inspector to the highlighted orange attached column area I’m trying to target.

    #av_section_1 > div > div.container > main > div > div > div.flex_column.av_one_fifth.flex_column_div.av-zero-column-padding.avia-builder-el-16.el_after_av_three_fifth.el_before_av_one_third.column-top-margin

    March 20, 2017 at 8:22 pm #763770
    John Torvik

    Hey artisforever,

    You can increase the column width adding this custom CSS code at Enfold Theme Options > General Styling > Quick CSS

    
.avia-builder-el-16 {
 margin-left: 0%;
 width: 20%;
}

    This code will change the width of this column: http://prntscr.com/emclqy

    Let me know if it works :)

    Best regards,
    John Torvik

    March 27, 2017 at 2:40 am #767124
    artisforever

    It looks great on your screenshot, and I actually think that width could work to compensate the space for the needed survey width.

    I can’t get anything to work on the front-end after trying that Quick CSS though! Tried Safari/chrome with refreshes as well!

    Thanks so much for your help.

    March 27, 2017 at 5:30 am #767186
    John Torvik

    Hi,

    Try to use the !important rule afther the property, like this:

    
.avia-builder-el-16 {
 margin-left: 0% !important;
 width: 20% !important;
}

    If it didn`t work, try to clear your cache.

    Best regards,
    John Torvik

    March 27, 2017 at 9:08 pm #767735
    artisforever

    Hi John,

    I got this to work finally with that addition.

    Sorry I wasn’t more specific too, is it possible thought to keep the elements above (so the icons w/ titles) where they originally were, and with the same width? I really liked the alignment before, but just the whole column couldn’t really fit that survey too much, so now we’ve solved that, but it is pushing the other content too close to the center image slider.

    Thanks for any advice here..

    March 28, 2017 at 12:02 am #767797
    artisforever

    Hi John,

    Just another quick note. It looks like this really throws things off via mobile too. Any work arounds for this? I believe you’re also helping me with getting the ALB elements to actually work in another thread. Should there be a desktop/mobile view for this?

    March 28, 2017 at 3:32 pm #768208
    Yigit

    Hi,

    Please enable custom css class name by placing a code snippet to your functions.php file as mentioned in this link http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/ and then edit your columns and give them a custom CSS class (“your-custom-class” in the example below) and then change the code to following one

    @media only screen and (min-width: 1024px) {
.your-custom-class {
 margin-left: 0% !important;
 width: 20% !important;
}}

    Best regards,
    Yigit

    March 29, 2017 at 12:42 am #768524
    artisforever

    HI Yigit,

    Your team is currently troubleshooting why turning on the custom css fields for elements isn’t working. I followed your guide and entered in your code into my functions.php file, updated, and found no change to any elements. I tried safari/chrome with cache clears. I believe I’ve used it in another website before using Enfold theme, not sure why it isn’t working now. I am using a child theme fyi.

    March 29, 2017 at 7:10 am #768615
    John Torvik

    Hi,

    You need to put the CSS code at Enfold Theme Options > General Styling > Quick CSS and not in the functions.php

    Best regards,
    John Torvik

    March 29, 2017 at 5:26 pm #768940
    artisforever

    That is where I am putting it.

    I asked that because it is not working via mobile, and if we should utilize the custom-css-fields to create a desktop/mobile version of this. It looks like Yigit provided the solution above. BUT I still can’t activate the custom-css fields at all, it isn’t working in my PHP file. The guide provided does not work for me.

    April 4, 2017 at 6:08 am #771508
    Ismael

    Hi,

    I added the “survey” class attribute to the column containing the survey script and modified the code in the Quick CSS field. It increased the width of the column but I’m not sure if that’s what you’re after. If not, please provide a screenshot of the layout that you have in mind.

    Best regards,
    Ismael

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