Okay so i have this converter, but when i convert lets say 100.000 it will mess up the structure?
I have tryed overflow:visible but it dont seem to work, min width is not an option either, also could we resolve this with out putting the css for the hamburger/div? its alot of css
The css for the insides of the dib
.currency_img{
padding-left:5%;
}
.curline{
padding-left:5px;
}
.form{
text-align:center;
}
#curr-hl{
text-align:center;
color:#fff;
font-size:32px;
font-weight: bold;
font-family: 'Passion One', cursive;
}
.currency_amount, .currency_code, .equals{
color:#9E9E9E;
padding-left:5px;
}
The HTML
<div id="wrapper">
<div class="overlay"></div>
<!-- Sidebar -->
<nav class="navbar navbar-inverse navbar-fixed-top" id="sidebar-wrapper" role="navigation">
<div id="converter">
<h1 id="curr-hl">Currency converter</h1>
<div class="form">
<input type="number" maxlength="2" id="amount" placeholder="Enter amount">
<input type="button" id="amount_btn" value="Convert">
</div>
</div>
<div id="result">Result here..</div>
</nav>
<!-- /#sidebar-wrapper -->
<!-- Page Content -->
<div id="page-content-wrapper">
<button type="button" class="hamburger is-closed" data-toggle="offcanvas">
<span class="hamb-top"></span>
<span class="hamb-middle"></span>
<span class="hamb-bottom"></span>
</button>
</div>
</div>