Adapt image 'backgroud-image' base64 to a 'div'?

0

I have an image (it can vary its dimensions) in base 64 that I have saved in the database, I want to adapt it to a div , but it is cut, as it would do so that in case it exceeds put a scroll . I've already put the overflow in css , but it does not work for me since it's not the overflowing count if it's not the background of the same div . With the img it does not help me because the idea is to put on divs with some buttons.

<ul class="nav nav-tabs">
        @foreach (var Casa in ViewBag.PlanoCasa)
        {
            <li><a data-toggle="tab" href="#@Casa.Id">[email protected]</a></li>
        }
    </ul>

    <div class="tab-content">
      @foreach (var Casa in ViewBag.Casa)
      {
        <div class="tab-pane fade active" id="@Casa.Id">
            <h3>Menu 1</h3>
            <div class="laclase" style="max-width: 100%; max-height: 100%; background-image:url(data:image/png;base64,@Casa.Imagen)">
                <!--<img src="data:image/png;base64, @Casa.Imagen" />-->

            </div>
        </div>


      }

    </div>
    
asked by Alcides Salazar 12.03.2018 в 20:02
source

2 answers

2

With the property background-size:cover as seen in the link: Example image adjustment

    
answered by 12.03.2018 в 20:13
2

With this the image should be adjusted to the container to which you apply it.

background-image: url("/imagen/rutaImagen");
background-position: center center;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
    
answered by 13.03.2018 в 03:08