Header moving and is too large

  • Hi, I just picked up a side-project to make repairs to this site (after previously owner) for a non-for-profit organization. Site. https://www.lanecountyhistoricalsociety.org

    Among 101 other fixes you may see, the first two I am trying to solve are the issue with the header being so very large (vertically) and the header also moving down while scrolling down the page and blocking out information at the top.

    These problems occur on any page. I have tried many times changing the header size in photoshop to no avail and even editing the .header{} section in the style.css to no avail. Am I doing something wrong? Where in the style.css do I alter/add code to fix this, if any, as there are no options in the customizer to deal with these particular things.

    Thank you. I appreciate any help.

Viewing 3 replies - 1 through 3 (of 3 total)

  • Did you say Photoshop? You may be in over your head here, Looks like this is all CSS and Parallax…

    .header {
    background: none no-repeat scroll center center / 100% auto rgba(0, 0, 0, 0);

    change the 100% and violá

    Thread Starter Robitron

    (@robitron)

    Thank you, Jaycbrf. Am I understanding that the header css should look something… more like the following? If so, I am still experiencing the problem of the image moving down the page below the nav-bar and into content when scrolling down. Also, the image is still to large vertically and when adjusting the % or the Auto it only seems to adjust the image and not the ‘container’ for that image (the white). That is if I change any of the “Auto” below to 75% I am only shrinking the image and am left with white-space (the rgb I have set) around it. I hope that makes some sense.

    .header {
    	background-image: none;
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: center center;
	background-size: 100% Auto;
	background-color: rgb(255,255,255);
	-moz-background-size: 100% Auto;
	-webkit-background-size: 100% Auto;
}
    Thread Starter Robitron

    (@robitron)

    (Ignore my last reply)

    I have set some of the CSS back to the original (as Jaycbrf suggested in the style.css) but I am still getting the problem with the header image moving below the navigation bar during a downward scroll.
    Depending on the screen, the image may or may not move into content. It should not move like this as compared to the original theme. Not sure where in the code this problem is being caused at all. Any further help out there?

    https://www.lanecountyhistoricalsociety.org/

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Header moving and is too large’ is closed to new replies.