Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • November 12, 2013 at 4:07 pm #187315
    miketran

    Is there a way to put borders around the Avia Layout Elements? Or, do you have suggestions on how I might design a page that contains design elements that look like the ones on this page: http://www.corepointhealth.com/products.

    I am not a coder, so I am hoping I can use the Avia Layout builder to achieve this kind of look.

    Thanks…

    • This topic was modified 10 years, 5 months ago by miketran.
    November 13, 2013 at 8:48 pm #187975
    Yigit

    Hi miketran!

    You can try adding following code to Quick CSS in Enfold theme options under Styling tab and adjusting it as desired

    div .flex_column { border: solid 2px #e1e1e1; padding: 10px; }

    Regards,
    Yigit

    November 14, 2013 at 2:35 pm #188355
    miketran

    Thanks Yigit…This is great…However, it would be nice to be able to selectively choose the elements…I experimented and tried selecting the specific element but it would not work…

    Here’s the code that I tried:
    div .flex_column av_one_full first avia-builder-el-2 el_after_av_hr
    { border: solid 2px #e1e1e1; padding: 10px;}

    Can you tell me if I am on the right track or correct this code for me? I assume that this code is the specific element:
    “div .flex_column av_one_full first avia-builder-el-2 el_after_av_hr”

    but that was just a guess…

    Thanks…

    November 15, 2013 at 5:08 pm #189285
    Yigit

    Hi!

    You can add border to certain elements as following

    .avia-builder-el-20 { border: solid 2px #e1e1e1; padding: 10px; }

    You should just inspect elements using developer tools on Chrome or Firefox, right click > Inspect Elements to find out element ID’s

    Cheers!
    Yigit

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘How to add border and adjust border color on Avia Layout Elements?’ is closed to new replies.