custom header builder

hello,

can i more custom header builder ?

on that website https://le-sixiemesens.fr/ i would like on mobile have my two buttons "OFFRIR" and "RESERVER" alone on first line but full width half 50% each one without padding ?

and how create a custom class css for the heaber builder button only. i want the same but i have to copy/paste each button's setting

thank you

Comments

  • and last can i add padding on logo ? or may i have to resize my logo ?

  • Hello,

    Sorry, but I quite do not understand the first part.

    Can you explain it to me in more detail, please?

    About the padding to the logo, you can use the following code:

    .mhb .logo{
       padding: 10px!important;
    }
    

    Thanks

  • ty.

    sorry for my english

    i would like the buttons "occupies all the space" of the bar

    to have on mobile on top of sticky menu like plain fix top bar with this 2 buttons

    full width buttons

    picture attached more easy to explain :-)

    and can i set the font size ?


  • or like this with 2 lines in builder header


  • Please, check the following code, and see if the display suits you.

    @media only screen and (max-width: 767px) {
       .mhb .mhb-button a.action_button{
       text-align: center!important;
       width: 120px!important;
       margin: 0!important;
     }
     .mhb-button{
       margin: 1px!important;
     }
    }
    

    Thanks

  • good way but not exactly

    can we delete 33px padding left and right only for that div ?

    can we set only 2 columns

    and width 120px is not responsiv ? i would like 100%


  • think it's something like this

    <code>@media only screen and (max-width: 767px) {

    .mhb .mhb-button a.action_button{

      text-align: center!important;

      width: 100%!important;

      margin: 0!important;

     }

    .mhb-button{

      margin: 1px!important;

     }

    .mhb-view.mobile.sticky .first-row .mhb-row-wrapper {

      padding: 0 10px!important;

     }

    .mhb-view.mobile .first-row .mhb-row-wrapper {

      padding: 0 10px!important;

     }

    }</code>

    but don't find how set column

  • sorry miss code insert

  • I have checked your website, and now the display is slightly different.

    Is that what you wanted to achieve?

    Is there anything else I could help you with?


    Thanks

  • yes i did nearly what i want.

    just didn't find how code 1 or 2 or 3 column and size of each ?

    ty

  • To adjust every button size you can use the :nth-child() in your custom CSS.

    You can read more about it under the following link:

    https://www.w3schools.com/cssref/sel_nth-child.asp


    Thanks

Sign In or Register to comment.
This website uses cookies

We use cookies to personalise content and ads, to provide social media features and to analyse our traffic. We also share information about your use of our site with our social media, advertising and analytics partners who may combine it with other information that you’ve provided to them or that they’ve collected from your use of their services.

Cookies are small text files that can be used by websites to make a user's experience more efficient.

The law states that we can store cookies on your device if they are strictly necessary for the operation of this site. For all other types of cookies we need your permission. This means that cookies which are categorized as necessary, are processed based on GDPR Art. 6 (1) (f). All other cookies, meaning those from the categories preferences and marketing, are processed based on GDPR Art. 6 (1) (a) GDPR.

This site uses different types of cookies. Some cookies are placed by third party services that appear on our pages.

You can at any time change or withdraw your consent from the Cookie Declaration on our website.

Learn more about who we are, how you can contact us and how we process personal data in our Privacy Policy.

Please state your consent ID and date when you contact us regarding your consent.