Tagged: , ,

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • September 19, 2014 at 2:59 pm #321902
    AnnemarieDoolin

    Hey guys,
    a client’s “lovely” designer wants boxes to look like the attached picture which will go on the frontpage (the size of a third):-
    Creating sections with borders and/or background color
    Having scoured shortcodes I see the advice is to stay away from creating more shortcodes… so I added a code block with the following code:

    <div class="shadow-orange" style="border: 3px solid #fe9763; color:#fe9763; padding:50px 30px 78px 30px;">
<span style="font-size:40px; font-weight:bold;">PRIVAT</span>
<p></p>
<p></p>
<p></p>
<div style="color:#fff; padding:50px 0px 100px 0px;">
<span style="font-size:20px; font-weight:bold; background-color:#BCBCB2;">RO OVERSKUD OG ØGET LYKKEFØLELSE</span>
</div>
<a class="avia-button avia-icon_select-no avia-color-custom avia-size-medium avia-position-right" style="background: none;  color:#fe9763; font-size:23px;" href="http://www.god-dag.dk/foredrag/kurser-private">
<span class="avia_iconbox_title">LÆS MERE</span>
</a>
</div>

    It worked but the text is not responsive! Could you advice me what I’ve done wrong??? LINK TO PAGE

    Thank you very much for your help!

    September 20, 2014 at 4:29 pm #322402
    Devin

    Hey Annemarie!

    You could

    • Use a code block and then use the themes column css wrappers to do it
    • Use a color section that you’ve given a ID to (in the developers field for ID) and then customize the css for the three columns using that unique ID as the main target for your css selectors: 
      
#my-id .flex_column.av_one_third.avia-builder-el-1 {
<some css>
}

      That is not the exact css for you but if you inspect the columns you’ll be looking for those general selectors to target and then prepend with your own ID and maybe some !important.

    Cheers!
    Devin

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