I'm making my first website with drupal 8 for a university project.

I currently have 2 problems unresolved, the first one is that using the geolocation module to add a google map location is giving me problems, the width is setted at 50% and i can't find the way to change it to 100%, since I can't find the .css file that generate the style from the location page. The code from website that I think responsible is:

<div class="geolocation-google-map geolocation-processed" style="height: 400px; width: 50%; position: relative; overflow: hidden;>

but I don´t know how to change it.

The second problem I have is that just over, it generate a div ("<"div">" Location "<"/div">") with the label title, and I would like to add a .css class to hide, or simply remove it.

PS: I don't know if it's important, but I'm also using drupal 8 zymphonies theme.

Thank you very much.


1) Assuming you already have sub-themed Zymphonies theme, just add this in your sub-theme's stylesheet-

.geolocation-google-map {
width: 100% !important; }

If not, read this documentation on sub-theming and do the above. Same goes for (2)

2) You can target your div (without class or id) using :nth-child() selector

Being a title, it usually is 1st or 2nd child of the view wrapper.If so

.view-name > div:nth-child(1) {
  //styles for a div that is the first child

.view-name > div:nth-child(2) {
  //styles for a div that is the second child

Note that the div you're targeting has to be the direct child of its predecessor

  • Sorry for the delay I was a little busy. I created the subtheme with you link and it worked Thank yo very much.
    – Jose
    May 28 '17 at 14:53

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.