Header size

Hi!

I am very new to homepages and blogging and I have some trouble fixing my header to the Activello theme, I have looked at some threads regarding the same issue and added a CSS code that seemed appropriate but it didn’t work as I wanted it to. I want to have a full-size header on my blog (wish a guess is the same as logo on this theme)
This is my page: http://www.viktoriaklevensparr.se
I added this CSS
body.blog #logo img.attachment-full.size-full{
display: none;
}

body.blog #logo .navbar-brand:before {
content: “”;
display: block;
width: 1000px;
height: 450px;
background-size: 100%;
background: url(http://www.viktoriaklevensparr.se/wp-content/uploads/2018/03/DSC00117_Header-1.jpg) no-repeat;
}
I changed to my uploaded image but it looks like it just zoomed in to the corner of the image and it is all blurry. How can I fix this? I wish the header would be without the “white frame” as well but it is not necessary. Please help me! Thank you.

Hi there

Hope you are having a good day and thank you for your question :slight_smile:
Let’s update your css little bit, remove previous version and use this one:

body.blog #logo img.attachment-full.size-full{
display: none;
}
body.blog #logo .navbar-brand:before {
content: “”;
display: block;
width: 1000px;
height: 450px;
background-size: 100%;
background-image: url(http://www.viktoriaklevensparr.se/wp-content/uploads/2018/03/DSC00117_Header-1.jpg);
background-repeat: no-repeat;
background-position-y: 80%;
}

please note, wit =h this property background-position-y: 80%; you can adjust image vertical position in the container if you want more height of the container then you have to increase 450px in the code

let me know if it worked,

Thanks!
Colorlib Support Team

Thank you so much for fast respond!
The CSS worked and it looks great! Thank you for your help :slight_smile:

Hi, there

Nice, to hear your problem is fixed:)
Now I will now close the topic and mark it as resolved.
Feel free to contact us again Thanks!