html - Why my input doesn't fit into the div? -
i wrote html , css codes:
html
<body> <div id="container"> <div id="containerheader"> <h1>seek & enjoy</h1> <h3>your movie seeker</h3> <div id="containerform"> <form class="form-wrapper cf"> <div id="inputplusbuttons"> <input type="text" placeholder="find movie" required> <div id="containerbuttons"> <button id="seek" type="submit">seek</button> <button id="reset" type="submit">reset</button> </div> </div> </form> </div> </div> <div id="results"> <p> </p> <div id="movielist"> </div> <div id="moviedetails"> </div> </div> </div> </body>
i'm trying fit input div i'm failing , don't know why (css code on jsfiddfiddle). reached these 2 options
in option 1 input width 100% input longer div. in option 2 added overflow: hidden
input cut , don't that.
does knows else can try fix it?
thanks
add box-sizing: border-box;
property input
styles. result.
Comments
Post a Comment