Background color of sidebar + prevent google maps zoom when scrolling

[mort1m]

I'm using the News Pro theme to set up a site for a friend. Among other things, I've run into two problems that I could not find the answer to using google...

1. I want the whole background area in the sidebar (al the posts/pages) to be filled with a color. I changed the background color in the class of .sidebar .widget in style.css, but that only gives the widget (gravity forms) the background color I want. When the main content on the same post stretches longer than the widget, there is white space below the widget. I also wants that space to have the same background color. How is that possible to fix?

2. On the same URL, I've embedded a google map in a hook using genesis simple hooks. Is it possible to prevent the map from starting to zoom/moving when the mouse reaches the map while scrolling? When on mobile this would be a big problem because the map fills the area where you would normally put your finger to scroll up or down. Now it just starts moving the map excerpt around, and you can't get either up or down on the page... "Activating" the map functions with a click/tap would be nice.

Thanks in advance 🙂

http://cracowholidays.com/wieliczka-salt-mine/

[Christoph]

Hi,

it looks like you solved your problems.

---

https://www.christophherr.com | Genesis Customizations | Buy me a coffee

[mort1m]

Hi Christoph. The problem is not really solved. At the site, there is now background color only behind the widget, not the whole sidebar container (as the main content stretches longer down than the widget in the sidebar) Suggestions are still welcome 🙂

[Christoph]

Hi,

sorry I misunderstood.

The sidebar only goes as far down as there are widgets in it.
The space underneath "belongs" to .site-inner.

You have to add a background-color to .site-inner (same color as the sidebar).
and to prevent the content area to have the same color,
add background-color: #fff; to .content.

---

https://www.christophherr.com | Genesis Customizations | Buy me a coffee

[mort1m]

Hi Christoph, thanks for taking your time. That did the trick 🙂 Much appreciated!

[mort1m]

I can see that when the widget expands (its a gravity form with some conditional logic that makes the widget longer as you fill out the form), the main content area gets the background color of the sidebar too. I can live with that, but is there an easy solution to get rid of that too?

[Christoph]

Hmm... I don't see that.
http://screencast.com/t/c1hy7AMpdwjB

Or is it happening on a different page?
Could you send a screenshot?

---

https://www.christophherr.com | Genesis Customizations | Buy me a coffee

[mort1m]

Yes, on the other tour pages where there is not so much content. Like here:

Czestochowa – Black Madonna Tour

If you start filling out the gravity form in the side bar, it extends lower than the content area, probably revealing the ".site-inner" area.

[Christoph]

Ok... try adding this to the style.css

.content-sidebar-wrap {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}

---

https://www.christophherr.com | Genesis Customizations | Buy me a coffee

[mort1m]

Excellent! Exactly what I was looking for. Thank you so much for solving my problem, Christoph 🙂

[Author]

Posts