Simpli header left and right dimensions and position

resame

Hello,
how can I adapt my image (which is already long and narrow) in the left header? In the attachment you can see that it appears incomplete and repeated.
And how can I choose the position of the right header? I would like to take it further to the right.
From the layout configuration menu I can't.
Thank you. 🙂

Image in site (show incomplete and repeat, and right header too center):

Original image, how it should be displayed:

aman204

resame Can you provide a link to your site in order to take closer look

resame

At the moment I can't open the site to the public, I will do it soon and I will show you.
In the meantime, could you tell me if I have to act in css? In which css?
Thank you. 🙂

Ninja

resame
Hi
we need to check it on site to see the css property after that we can share the css changes.
It needs changes in background size of image but i am not sure about the style classes used in head.
Once we have site URL we can share accurate code.

Regards

resame

Hi pankaj and all, here is the site: www.rsmcampobasso.it
I made some progress, but the situation is not good, I explain why: I inserted a header of 1900px width and 160 px height, I see it well on my monitor at resolution 1920x1080, but the responsive function goes wrong and I don't know how It is also seen at other resolutions.
And then a strange thing: the height of header is good only if I activate the "banner simple" at the top, which I had to insert with a transparent image... strange!
Questions:
1) How big is a Simpli header to be good for all resolutions (smartphone, desktops, etc.)?
2) How can I make header responsitive?
3) I want the logo (white and light blue, at left) to be directly on the image of the header like that of now and not as a "Logo" function.
4) I don't want to activate the top banner for see the header well.
Thank you. 🙂

Ninja

resame
Hi
Add this code in custom.css file to make the banner working in small device as well

#header.stick-on-top {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    z-index: 21;
    background-size: 100%;
    background-repeat: no-repeat;
}

I do not understand point 4 and 5 as its already showing on site.

resame

Hi pankaj,
I created a custom.css file and I entered the code, but it does not work.
In points 3 and 4 I said that I have the "logo" function deactivated and also the "header right" function is deactivated.

aman204

resame Try add this also to CSS declaration also to above CSS suggested:

background-size: cover;

For 3) and 4), The logo image can already be seen stacked on top of banner. Not still sure as to what is desired, To be more precise and avoid confusion/ambiguity in addressing your query, Kindly provide screenshot marked with annotations showing as to what is needed

resame

I was wrong to create the custom.css, I had create it in the "admin/assets/css" and not in "css" only.
Now it works, the header gets smaller gradually, great, thanks!
But can't see the lower part of header, it's cut. How can I lower the "line" that cuts the header and view the header full? The header height is 160px.
Thank you! 🙂

For 3/4 no problem, I was referring to the Logo and the Top banner, but now they are deactivated, I do not need them.

resame

I think I have solved: I entered the 160px height;" code under weidht, in the code given by you.
Great, thanks again!

P.S. A curiosity: what should change with the value "background-size: cover;" suggested instead of other?

Ninja

resame
Hi
background size is used to spread the bg image, 100% size is original size of image, and make it cover will add the bg all over, depend on the container size.

Regards