How to resize image with Bootstrap[Answered] RSS

• • Reply
  coreysan

  Member

  57 Points

  169 Posts

  How to resize image with Bootstrap

  Nov 24, 2020 10:39 PM|coreysan|LINK

   I recently bought a template I really like, which uses bootstrap.

  1. The container width is 1230px
  2. The Col-lg-6 is set to max-width: 50%
  3. My image is 900x710

  So at runtime, the image re-calculates to 585x461.

  Well, I decided to increase the width of the container from 1230px to 1300px. That increases the width of Col-lg-6, which in turn makes the image calculate to 620x489 at runtime.

  I can fix the image size, but the container would still be 28px more in height. Is there a clever way to knock the extra height out? The extra 28px screws up alignment to other divs, and looks less than stellar.

  Any suggestions?

• • Reply
  yij sun

  Contributor

  3430 Points

  1300 Posts

  Re: How to resize image with Bootstrap

  Nov 25, 2020 07:50 AM|yij sun|LINK

  Hi coreysan,

  Accroding to your description,I have created a test and reproduce your problems.

  You could adjust  stretching ratio of height and width using @media.

  I suggest you could post your codes to us.It will help us to solve your problems. 

  Best regards,

  Yijing Sun

  .NET forums are moving to a new home on Microsoft Q&A, we encourage you to go to Microsoft Q&A for .NET for posting new questions and get involved today.
• • Reply
  pauldore

  Member

  10 Points

  1 Post

  Re: How to resize image with Bootstrap

  Nov 26, 2020 07:34 AM|pauldore|LINK

  For Boostrap, maybe you need check this guide about Enhance Bootstrap forms with WYSIWYG editing. Using WYSIWYG Editing will be good for this case.