Header and "How it works" Border

Hello,

I have a screenshot provided for my two questions:

1)How can I get rid of this header that is showing up on all my pages?

2) How can change and make the border color darker on my "How it works" element
image


Comments

  • *Update- I figured out how to make the header background white, but is there a css code I can put somewhere to reduce the height of the header? Because right now since I have it as white, there is a huge gap on my page.

    I still need help with changing the border color and width for the "How it Works" element that is provided in the screen shot.

    I really appreciate any help you can provide. I have been spending hours trying to figure this stuff out :)
  • Okay, this is my last time :) I'm going to bed now! 

    I figured out the header height thing. But is there a way that I can insert a custom picture (that I can define the size) as my header? 

    I still need help with changing the border color and width for the "How it Works" element that is provided in the screen shot.

  • Hi,

    1) Header image can be turned off in Theme options > Layout > Header section where "Header | Minimalist" option is. Also instead of removing this section, you can setup own image for each page. This can be done on right hand side where "Featured image" field is while you create/edit page.

    2) To change border color, please use below css:
    .how_it_works .image { border-color: #000 !important; }
  • Thank you!!!!!!!!!!!!!!!

    I am loving the be theme and Muffin Builder- so glad I purchased this. Makes it really easy for beginners like myself!

    Keep up the excellent work.
  • Oh, one more thing. How about the lines on the "How it Works" element?

    The ones, that I am able to put in between the bubbles
  • The lines between bubbles, can be changed within below css:
    .how_it_works.has_border::after { background: #000 !important; }
  • edited March 2015
    I did what you said by setting a featured image, but only a portion of the picture showed up (the rest was cut off).

    I would like for the entire picture to show. I have an example attached. As you can see, the full size image is located directly under the menu. It's like a page header.image

    I would REEEALLLLYYY appreciate if you are able to help with this!
  • So to get something as on image above, or you will use Revolution Slider instead of you must use some custom css to expand header section where image is.
  • Short question to the provided border color css-code .how_it_works .image { border-color: #000 !important; } 
    It works for me on desktop screen but under 1200px width it gets back to normal color, how to solve that? Thanks.
  • hannessauter
    Please send a link to you page and shows us where the problem is located.
    thanks
  • Thank you for your response, it's located here: https://kaelteblitz.de/service/

    The blue border around the icon box... it's changing back to grey color in smaller screens... 
  • You can add this css
    .how_it_works .image {
    border-color: #316ED2 !important;
    }
    thanks
  • I already added that css... but its not working on smaller screens - it is switching back to standard border color.
  • Please add this css to theme options>custom css and disable those optimization plugins, also clear cache. The css is working fine, we checked it using the browser inspector.
    thanks
  • I moved the css on first position... it works like that. Don't know why, but it does :). Thank you for your help!
  • This could be because you have an error in your css.
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.