CODEWITHSUNDEEP
htmlcss
Tigran
Tigran

Reputation: 674

Two divs on same position

I got two divs. The second div should be on first div, so... When clicking at menu buttons in first div, there should appear second div on first div (the second div covers the first one). I created the second div under first one, gave to it relative position, and took it up to first one. But there is a problem. There is an overflow, cause the div is long, and div's height saved at bottom. How to do this thing without any problems?

Upvotes: 7

Views: 28426

Answers (3)

MintWelsh
MintWelsh

Reputation: 1259

Real answer available via css-grid,

setting the parent to display:grid

and the children to grid-row/column-start:1 as shown in the answer below

https://stackoverflow.com/a/50086485/3810321

Upvotes: 1

Harshit Tailor
Harshit Tailor

Reputation: 3281

HTML

<div class="one">
    <div class="two"></div>
</div>

Css :-

.one
{
   width: 170px;
height: 170px;
position: relative;
background: red;
}
.two
{
   width: 70px;
height: 70px;
position: absolute;
background: black;
}

jsfiddle demo

http://jsfiddle.net/xnqsF/

Upvotes: 5

hobberwickey
hobberwickey

Reputation: 6414

HTML

<div class='wrapper'>
   <div class='firstDiv'></div>
   <div class='secondDiv'></div>
</div>

CSS

.wrapper{
  position: relative;
}

.firstDiv, .secondDiv{
  position: absolute;
}

Upvotes: 19

Related Questions