Community Forums › Forums › Archived Forums › Design Tips and Tricks › Background color of sidebar + prevent google maps zoom when scrolling
- This topic has 9 replies, 2 voices, and was last updated 8 years ago by mort1m.
-
AuthorPosts
-
March 28, 2016 at 8:13 am #182370mort1mMember
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/April 2, 2016 at 11:12 am #182754ChristophMemberHi,
it looks like you solved your problems.
April 4, 2016 at 2:20 pm #182907mort1mMemberHi 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 🙂
April 4, 2016 at 5:06 pm #182925ChristophMemberHi,
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.
April 4, 2016 at 11:11 pm #182958mort1mMemberHi Christoph, thanks for taking your time. That did the trick 🙂 Much appreciated!
April 4, 2016 at 11:29 pm #182960mort1mMemberI 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?
April 5, 2016 at 7:59 am #182987ChristophMemberHmm... I don't see that.
http://screencast.com/t/c1hy7AMpdwjBOr is it happening on a different page?
Could you send a screenshot?
April 5, 2016 at 8:38 am #182994mort1mMemberYes, on the other tour pages where there is not so much content. Like here:
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.
April 5, 2016 at 8:59 am #182995ChristophMemberOk... try adding this to the style.css
.content-sidebar-wrap {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
April 5, 2016 at 9:16 am #182996mort1mMemberExcellent! Exactly what I was looking for. Thank you so much for solving my problem, Christoph 🙂
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.