3 Replies Latest reply on Apr 8, 2014 9:13 PM by SusannaMoore

    how can resize image on footer?

    happyho

      Title

      how can resize image on footer?

      Post

           Dear All,

           On layout footer, I added one image as the footer's background, but whenever I resize the windows, the image cannot resize to fit the windows's width. How can I make the image size when there is action to resize the windows? Is there any way?

           Thanks

        • 1. Re: how can resize image on footer?
          philmodjunk

               You can set left and right autsizing anchors to make the width of the field change as the window resizes, but since this does not change the height of the container field, there's a good chance that the image in the container field will not resize to fit the container field--especially if the maintain proportions option has been selected for the field in data formatting.

          • 2. Re: how can resize image on footer?
            arronlee

            You can google it ans select a 3rd party Image Resizer which allows users to customize the size of images. And you can change its sizes fit the windows's width with the help of it. Remember to check its free trial package first if possible. I hope you success. Good luck.
                 
                 
                 
                 Best regards,
                 Arron

            • 3. Re: how can resize image on footer?
              SusannaMoore

                   I want the background image in my footer to resize proportionately, just like the header image automatically does. And I achieve that and process image like below. If I understand correctly, the height/width in the stylesheet need to be set up this way for image resizing

              #colophon {
                   position:relative;
                   background: url(images/RAMS_footer.png) center top no-repeat;
                   background-size:100%;
                   max-width:100%;height:auto;
                   padding:0px;
                      border-top: 0;
                   margin-top:0px;
                   margin-top:0rem;
              }