css - responsive image using the after selector -


i'm wondering if can make image inserted :after responsive.

html:

<div class="col-md-3 swap-bot main-sidebar sidebar">     <ul id="shop-sidebar">        <li id="text-2" class="widget widget_text">           <h2 class="widgettitle">shop powered </h2>        </li>     </ul> </div> 

css:

.sidebar>ul>li {   background: #fff;   border: 1px solid #aaa;   border-bottom-width: 2px;   border-radius: 3px;   -webkit-border-radius: 3px;   -moz-border-radius: 3px;   margin-bottom: 20px !important; }  .sidebar .widgettitle {   font-size: 16px;   font-weight: 700;   padding: 15px 15px 10px 15px;   margin-bottom: 0 !important;   border-bottom: 1px solid #aaa !important; }  #text-2 h2:after{     content: url('https://blabla.com/wp-content/uploads/2015/05/small.png');     display: block;     padding-top: 10px;     background-size: contain;     background-position: center; } 

i tried add max-width:100%; height:auto; doesn't work either.

can point me in right direction?

thanks!


Comments

Popular posts from this blog

android - MPAndroidChart - How to add Annotations or images to the chart -

javascript - Add class to another page attribute using URL id - Jquery -

firefox - Where is 'webgl.osmesalib' parameter? -