0
I am facing some difficulties while trying to align the following content
HTML
<div class="header">
<div class="logo-para-header">
<h2>Logo teste</h2>
</div>
<div class="content-wrap">
<div class="modal wrap-user">
<img src="">
<span>TESTE</span>
</div>
</div>
</div>
<div class="menu-aside">
<ul>
<li onclick="abreInicio()">
Início
</li>
</ul>
<ul>
<li onclick="abreBanners()">
Banner
</li>
</ul>
<ul>
<li onclick="abreProdutos()">
Produtos
</li>
</ul>
<div class="footer-menu-admin">
Desenvolvido por Endrews.
</div>
</div>
<div class="content-wrap">
<div id="inicio-modal" class="modal">
<div class="inicio">
<div class="form-header">
<p>Informações básicas</p>
</div> ...
CSS
.content-wrap{
display: inline-block;
box-sizing: border-box;
float: left;
position: absolute;
background-color: rgba(241,242,247,1);
height: auto;
width: calc(100% - 300px);
overflow-y: auto;
min-height: 100%;
height: 100%;
}
.wrap-user{
background-color: red;
}
.modal{
margin-left: auto;
margin-right: auto;
width: 100%;
max-width: 1024px;
}
.inicio{
box-sizing: border-box;
width: 100%;
margin-top: 25px;
}
.header{
box-sizing: border-box;
position: relative;
width: 100%;
height: 80px;
font-family: 'Open Sans', sans-serif;
font-size: 16px;
color: rgba(255,255,255,1);
}
.logo-para-header{
float: left;
display: inline-block;
box-sizing: border-box;
width: 300px;
height: 80px;
padding-top: 23.889px;
padding-bottom: 23.889px;
padding-left: 55px;
text-align: left;
background-color: rgba(31,181,173,1);
}
.menu-aside{
display: inline-block;
float: left;
position: relative;
box-sizing: border-box;
width: 300px;
/* Altura mínima de 100% do espaço que sobra, evitando 'overflow' */
min-height: 100%;
/* Height auto ajustável pelo navegador */
height: auto;
font-size: 20px;
text-align: left;
color: rgba(174,178,183,1);
background-color: rgba(50,50,58,1);
}
What are these difficulties? what are you trying to do? have you used any grid or media queries system?
– Gabriel Rodrigues
align the 'test' to basic information, I used yes, and it is with himself that you are giving this problem, and I tried also media queries, but the margin and positions do not work
– Murilo Melo
Cool, create a fiddle with the full example using the grids and such that facilitates in solving the problem
– Gabriel Rodrigues
It will take a long time :/ ta in the company’s Rv and only come back Monday, I wanted an ex. functional for me already go testing at home :3
– Murilo Melo
I also think so, the problem is that without providing the basic information to test and see the problem becomes difficult to help
– Gabriel Rodrigues