I need to do a layout on my page, as follows. That I have three textbox controls, one underneath the other and taking the other side all the rest with a table. See below how I need it.
Ihavetriedinmanyways,reducingmygridfrom12to6andwhathappenswhenIputtheimageisasfollows:Theimageactuallysitstotherightofthecontrols,butpushesthecontrolsdown.ThetableImadeisjustanexample.
Seebelowhowthescreenwas
This is my cshtml. This table is just for testing, the values have nothing to do, I'm just testing the screen layout.
@{
ViewBag.Title = "CadastroAcesso";
Layout = "~/Views/Shared/_LayoutBase.cshtml";
}
<h2>Cadastro de Acesso ao Sistema</h2>
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="col-md-2">
<label for="txtUsuarioRede">Usuário de Rede:</label>
</div>
<div class="col-md-4">
<input type="text" class="form-control col-md-6" name="txtUsuarioRede" id="txtUsuarioRede" placeholder="Digite um usuáruo da rede">
</div>
<table data-url="data1.json" data-height="299" data-sort-name="name" data-sort-order="desc" border="1">
<thead>
<tr>
<th data-field="id" data-align="right" data-sortable="true">Item ID</th>
<th data-field="name" data-align="center" data-sortable="true">Item Name</th>
<th data-field="price" data-sortable="true">Item Price</th>
</tr>
</thead>
<thead>
<tr>
<th data-field="id" class="col-md-2">Item ID</th>
<th data-field="name" class="col-md-6">
<i class="glyphicon glyphicon-star"></i>
Item Name
</th>
<th data-field="price" class="col-md-4">
<i class="glyphicon glyphicon-heart"></i>
Item Price
</th>
</tr>
<tr>
<th data-field="id" class="col-md-2">Item ID</th>
<th data-field="name" class="col-md-6">
<i class="glyphicon glyphicon-star"></i>
Item Name
</th>
<th data-field="price" class="col-md-4">
<i class="glyphicon glyphicon-heart"></i>
Item Price
</th>
</tr>
<tr>
<th data-field="id" class="col-md-2">Item ID</th>
<th data-field="name" class="col-md-6">
<i class="glyphicon glyphicon-star"></i>
Item Name
</th>
<th data-field="price" class="col-md-4">
<i class="glyphicon glyphicon-heart"></i>
Item Price
</th>
</tr>
</thead>
</table>
</div>
<div class="col-md-12">
<div class="col-md-2">
<label for="txtUsuarioRede">Usuário de Rede:</label>
</div>
<div class="col-md-4">
<input type="text" class="form-control col-md-6" name="txtUsuarioRede" id="txtUsuarioRede2" placeholder="Digite um usuáruo da rede">
</div>
</div>
</div>
</div>