1
I need to make a layout on my page, as follows. That I have three textbox controls, one at the bottom of the other and picking the other side all the rest with a table. See below how I need.
I tried it in several ways, decreasing my grid from 12 to 6 and what happens when I put the image is the following: The image actually goes to the right of the controls, but pushes the controls down. The table I made is just an example.
See below how the screen looked
This is my cshtml. This table is for testing only, 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>