Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Estou tentando posicionar os elementos fora da div aplicando uma margem negativa, mas quando faço isso, o elemento fica "por baixo" da div e não por cima.
Como gostaria que ficasse: (inputs)
/monthly_2018_01/image.png.2c7ceaf1c2166e4a03dced903dee12c8.png" style="width:400px;height:auto;" />
Como realmente está ficando:
/monthly_2018_01/image.png.1620f5e849595f10ff9aef910b487950.png" />
Como pode ver pela seleção, o conteúdo está fora da div, mas não está aparecendo.
Tentativas:
já apliquei position:relative e coloquei um z-index: 2; no form para ficar em cima, mas não deu certo.
Alguém tem uma ideia?
>
57 minutos atrás, joy_santos disse:
se tu colocar uma class dentro da tag input com o z-index com um numero consideravelmente maior, também não dá certo?
Também não, olha:
Veja que o input nome está mais pra esquerda e mesmo assim não aparece ele "do lado de fora".
A título de curiosidade, estou usando o modal SweetAlert2 (https://sweetalert2.github.io/)
>
8 minutos atrás, leodiegoo disse:
Também não, olha:
Veja que o input nome está mais pra esquerda e mesmo assim não aparece ele "do lado de fora".
A título de curiosidade, estou usando o modal SweetAlert2 (https://sweetalert2.github.io/)
tu poderia usar uma div com fundo transparente só para os inputs e colocar ela acima dessa div com fundo branco, ai posicionando a div com os inputs mais pra esquerda eles vão certinho, é uma ideia, já que eu não tenho em mãos o seu código pra dar uma olhada
Fiz um exemplo aqui, testa aí e ver se deu certo, porque não testei, mas a lógica é mais ou menos assim.
<style>
body {background-color: black}
.box-pai {
position: relative; /* Para conter a posição absolute */
width: 80%; /* 80% de largura para não cobrir a tela toda */
min-height: 460px; /* Altura mímima do tamanho da box-fundo */
margin: 10% auto; /* 10% de margim ao topo e altomatizar esquerda e direita (Centralizar) */
border: 1px solid white /* Só para mostrar as delimitações */
}
.box-fundo {
margin-left: 100px; /* Uma distância à esquerda para aplicar o efeito */
background-color: red; /* Para mostrar */
width: calc(80% + 100px); /* 80% da largura da box-pai mais os 100px de margim aqui aplicados */
height: 460px /* Altura tem que existir para que funcione */
}
.box-dos-inputs {
position: absolute; /* Para jogar essa box por cima da box-fundo */
left 0; /* Á esqueda 0 para aplicar o efeito porque a box anterior está a 100px de distância */
top: 60px; /* Para não ficar no ficar abaixo da box-fundo e dar uma distância do topo */
width: 50%; /* Para mostrar uma largura qualquer */
height: 340px; /* Altura menor para não ficar até o fim da box-pai */
background-color: green /* Só para mostrar */
}
</style>
<div class="box-pai">
<div class="box-fundo"></div>
<div class="box-dos-inputs"></div>
</div>
se tu colocar uma class dentro da tag input com o z-index com um numero consideravelmente maior, também não dá certo?