html - Border on element inside a single image -
i'm struggling on problem. have put border on element inside image(i can't put image due reputation under 10) border should have same width , height of element.it should responsive.i write code based on bootstrap media screen resolution when reduced page wide becomes small @ specific screen resolution.that's code.thanks.
<div class="parent"> <img /> <span class="makeborder"></span> </div>
and css:
.parent { position: relative; } .makeborder { position: absolute; top: 15px; left: 23px; border: 2px solid red; width: 83%; height: 83%; }
what do:
<div class="customclass"><img /></div> .customclass{outline:1px solid red;outline-offset:-18px;}
try hereby use button on image , correctly work.some of css property no useful in example denoted //.
<html> <head> <style> div{ background:url("1.jpg") no-repeat; background-size:contain;// height:500px;//height of div width:500px; } button{ height:50px; width:70px; outline:red solid 4px; margin:20px 20px; } </style> </head> <body> <div> <button >hello</button> </div> </body> </html>
Comments
Post a Comment