Piwigo.org

kinmen · 2024-01-11 19:27:46

Greetings,

I wonder if it is possible to set a custom width for the main map, the one at the top in the home page: i find difficult to scroll the page, especially with smaller screens, by moving the cursor on the scrolling bar which is very close to the map image, right side of the browser's page. It would be nice to be able to set a "%" width, so that the map doesn't reach exactly the border of the web page and can leave some more space to scroll it.
What do you think?

Katryne · 2024-01-11 22:03:43

Kinmen, here what I tried first : (in Local Files Editor, css tab, template is Bootstrap)

#osmmap {max-width:90%;margin:0 auto;}
and that did the job.You could try a different width, playing with the 90 %

Then I wanted also a kind of frame, and shadows and below is what I have :
#osmmap {
box-shadow: 5px 5px 20px #14153a;
border-color: rgb(255, 207, 9);
border-style: solid;
border-width: 0;
display: block;
padding:1%;
margin:1rem auto;
text-align:center;
}

Look here (my map is nearly at bottom, not on top) : https://album.chauvigne.info/

Last edited by Katryne (2024-01-11 22:05:00)

kinmen · 2024-01-12 12:13:47

Thank you for sharing. Btw the css element is called #map, not #openstreetmap, is it? I added another style to your snippet, to center the map, so that it looks like:

#map {
height: 500px;
width: 90%;
display: block;
margin: 0 auto;

}

Nice Piwigo gallery btw ;)
K.

Katryne · 2024-01-12 12:40:50

Sorry : it's because I use Openstreet map plugin, not Google.

kinmen · 2024-01-18 12:37:19

me too, but couldn't find #openstreetmap element, just #map

Piwigo.org

Announcement

#1 2024-01-11 19:27:46

openstreetmap main map size

#2 2024-01-11 22:03:43

Re: openstreetmap main map size

#3 2024-01-12 12:13:47

Re: openstreetmap main map size

#4 2024-01-12 12:40:50

Re: openstreetmap main map size

#5 2024-01-18 12:37:19

Re: openstreetmap main map size

Board footer