Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • April 4, 2018 at 3:30 pm #937224
    bakbek

    Hi, for some reason that I don’t understand, on my macbook screen the button breaks into 2 lines when it really shouldn’t as the text is not that long.

    I want to keep the button in one line across all devices.

    How can I this? Is there something in the Custom CSS that causes this break?

    April 5, 2018 at 7:34 am #937516
    Nikko

    Hey DROR,

    Can you try adding this css code in Quick CSS (located in Enfold > General Styling):

    #top .av_one_fourth .avia-button.avia-size-x-large {
    padding: 25px 20px;
    font-size: 18px;
}

    Hope it helps :)

    Best regards,
    Nikko

    April 8, 2018 at 5:19 pm #938843
    bakbek

    That doesn’t seem to work. I also changed the numbers and don’t see any changes on the site.

    April 8, 2018 at 8:46 pm #938875
    Guenni007

    please a link or the way you set up that button row
    Layout screenshot f.e.

    or try with body#top etc.
    because the original button rule starts on body too:
    body div .avia-button …

    body#top .avia-button.avia-size-x-large {
    padding: 25px 25px 23px;
    font-size: 18px;
}

    maybe an !important is necessary on those rules

    best would be to be more specific to have a custom class on it

    April 9, 2018 at 11:06 am #939058
    Victoria

    Hi bakbek,

    This is not a perfect solution, the distance between the buttons will not be the same but you can see if this works for you.

    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

    
@media screen and (min-width: 768px) and (max-width: 1099px) {
  .avia-button-wrap.avia-button-right.avia-builder-el-14 {
    float: left;
    margin-left: -16em;
  }
}
@media screen and (min-width: 1100px) and (max-width: 1300px) {
  .avia-button-wrap.avia-button-right.avia-builder-el-14 {
    float: left;
    margin-left: -14em;
  }
}
@media screen and (min-width: 1301px)  {
  .avia-button-wrap.avia-button-right.avia-builder-el-14 {
    float: left;
    margin-left: -10em;
  }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    April 9, 2018 at 4:29 pm #939298
    bakbek

    Hi Victoria, you are referring to 2 different buttons. I am talking about the buttons at the bottom of the page.

    See the attached screenshot.

    April 10, 2018 at 7:42 am #939650
    Nikko

    Hi bakbek,

    Can you try to use this instead:

    @media only screen and (min-width:960px) and (max-width:1024px) {
  #top .av_one_fourth .avia-button.avia-size-x-large {
    padding: 25px 20px !important;
    font-size: 18px !important;
  }
}

    Best regards,
    Nikko

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