Round Menu Buttons

Comments

• Phil

  May 2021

  Hello,

  There is no setting or option to achieve that, but you can create some CSS code to do it.

  If you need help with it, please, let me know, but I will need a link to your website.

  
  

  Thanks

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• Deean

  May 2021

  Hello Phil

  Thank you for your response.

  Here is the link: https://www.xn--gefssmedizin-icb.ch/

  As you can see the Menu so far is Text, underlined and with color.

  What is desired: That the Menu (single links) are shown like buttons. The roundness and size of the buttons behind the text should be customizable.

  
  

  Thank you so much for your help

  Kind regards, Andreas
• Phil

  May 2021

  Please, put the following CSS code in Betheme -> Theme options -> Custom CSS & JS -> CSS.

  #Top_bar .menu .menu-item span{
     background-color: #621379!important;
     border-radius: 27px!important;
     margin: 1px!important;
  }
  

  But if you would like to have a different background color for each menu item, you will have to create a CSS class for them.

  

  

  Thanks

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• Deean

  May 2021

  Perfect, Thank you :)

  Is it possible to get rid of the underlines?
• Deean

  May 2021

  And to have a white border (I tried -- border: 2px solid #fff; -- but it didn't work)?
• Phil

  May 2021

  1) To remove the underline, please, go to Betheme -> Theme options -> Menu & Action Bar -> Menu, and from Style dropdown menu, select something else than Line below.

  

  2) Please try the following code:

  html body #Top_bar .menu .menu-item span{
        border: solid 2px #fff!important;
  }
  

  Thanks

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• Deean

  May 2021

  Perfect! Thank you so much for your help :)

  You guys are the best!