3 Replies Latest reply on Jul 24, 2017 5:29 AM by tevy

    Stopping responsive design going past a set margin?

    tevy

      Hello, Muse users.

       

      I'm struggling to use responsive design the way I want to use it.

      I have an image in a gallery widget and when sizing down the browsers in does what responsive design does, the only downside is that it overlaps some menus and text I have on the left-hand side that I don't want it to overlap. Is there a way to create a fixed browser margin of sorts to have the responsive design no go past that point.

       

      Here is an example that fully illustrates what I'm attempting to do. site > Marc Baptiste.

      Notice how when you scale your browser down the image doesn't go past and overlap the size menu, is this achievable in Muse?

       

      Thank you,

       

      Chevy.

        • 1. Re: Stopping responsive design going past a set margin?
          Ussnorway Adobe Community Professional

          this design will work down to 330 width... below that gets tricky but you can download the site to see what makes it work

          image

          1 person found this helpful
          • 2. Re: Stopping responsive design going past a set margin?
            fotoroeder Adobe Community Professional

            As of this reading galleries are not responsive in muse.

            I think it could be something like this in future ( I created almost the same in the prerelease with a gallery, which is helpful because the next and rev buttons are responsive as well in the latest prerelease )

            Gallery-rightset

            I did it with only one picture and it is necessary to use breakpoints, as well as in the prerelease.

            In your example the picture also is centered in height which is not possible out of the box.

            I didn`t find a way (tried the same as Ussnorway, but that didn`t satisfy me at all as theres lots of space between menu and picture) to set something like a left margin to stop overlapping.

            Only one way would prevent the overlapping: set the text menu to responsive width (in my first example I set it to not resize at all), but then you have to deal with the changing/moving appearance of the menu.

            left-rightset-menu   I added some right padding to the menu (30):

            Bildschirmfoto 2017-07-24 um 10.13.15.png

            So whatever you prefer – but still galleries are not responsive except some 3rdparty galleries.

             

            We are all waiting for responsive galleries

             

            Uwe

            1 person found this helpful
            • 3. Re: Stopping responsive design going past a set margin?
              tevy Level 1

              Thank you for your in-depth alternative solutions. It's good to know I wasn't missing some obvious menu setting. Seems like we still have to do some trickery to get these things to work the way we want.

               

              Thank you for this. This solution is perfect for what I need to do. fotoroederUssnorway