Есть ли способ заставить два элемента div действовать как один? ⇐ CSS

[Anonymous]

Итак, моя проблема в том, что я пытаюсь сделать эту веб-страницу адаптивной. И чтобы сделать это, мне пришлось бы сжать два элемента div одновременно, не накладывая один на другой, а это противоположно тому, что происходит сейчас. Я попытался обернуть два элемента div в один большой элемент div, а затем установить его максимальную ширину. Но оказалось, что это не сработало, и я не знаю почему. Большое спасибо за любые ответы.
мой код вставлен здесь:

Код: Выделить всё

#headerMem {
text-align: center;
width:100%;
background-color: rgb(17, 17, 17);
height:15vh;
margin:0px;
line-height: 15vh;
font-family: "Pixelify Sans", Arial, Helvetica, sans-serif;
font-size: 50px;
color:white;
}
body {
margin:0px;
}
p {
margin:0px;
}
#mainBody {
background-color: rgb(38, 38, 38);
width:100%;
height: 900px;
}
#normMem {
width:500px;
height:75%;
background:linear-gradient(rgb(255, 137, 137), rgb(137, 137, 255));
border-radius: 30px;
display: inline-block;
margin:5px;
box-shadow: 0px 20px black;
border:1px solid black;
color:black;
}
#normMem:active {
width:500px;
height:75%;
background:linear-gradient(rgb(255, 137, 137), rgb(137, 137, 255));
border-radius: 30px;
display: inline-block;
margin:5px;
box-shadow: 0px 10px black;
border:1px solid black;
color:black;
transform: translateY(10px);
}
#delMem {
width:500px;
height:75%;
background:linear-gradient(rgb(255, 137, 137), rgb(137, 137, 255));
border-radius: 30px;
display: inline-block;
border:1px solid gold;
margin:5px;
color:black;
box-shadow: 0px 20px black;
}
#delMem:active {
width:500px;
height:75%;
background:linear-gradient(rgb(255, 137, 137), rgb(137, 137, 255));
border-radius: 30px;
display: inline-block;
border:1px solid gold;
margin:5px;
color:black;
box-shadow: 0px 10px black;
transform: translateY(10px);
}
#normMem:hover {
width:500px;
height:75%;
background:linear-gradient(rgb(255, 137, 137), rgb(137, 137, 255));
border-radius: 30px;
display: inline-block;
margin:5px;
cursor: pointer;
color:black;
}
#delMem:hover {
width:500px;
height:75%;
background:linear-gradient(rgb(255, 137, 137), rgb(137, 137, 255));
border-radius: 30px;
display: inline-block;
border:1px solid gold;
margin:5px;
cursor:pointer;
}
#optionsMem {
text-align: center;
background-color: rgb(33, 33, 33);
height:90px;
font-family: "Pixelify Sans", Arial, Helvetica, sans-serif;
color:white;
line-height: 90px;
font-size: 35px;
}
#delMemHeader {
text-align: center;
font-family: "Pixelify Sans", Arial, Helvetica, sans-serif;
padding:50px;
font-size: 50px;
}
#normMemHeader {
text-align: center;
font-family: "Pixelify Sans", Arial, Helvetica, sans-serif;
padding:50px;
font-size: 50px;
}
#normMemList {
font-family: "Pixelify Sans", Arial, Helvetica, sans-serif;
text-align: center;
font-size: x-large;
}
#delMemList {
font-family: "Pixelify Sans", Arial, Helvetica, sans-serif;
text-align: center;
font-size: x-large;
}
#normMemP {
font-family: "Pixelify Sans", Arial, Helvetica, sans-serif;
text-align: center;
font-size: large;
padding:10px;
}
#delMemP {
font-family: "Pixelify Sans", Arial, Helvetica, sans-serif;
text-align: center;
font-size: large;
padding:10px;
}
#backArrow {
transform: translate(10px, 60px);
font-size: 40px;
color:white;
cursor: pointer;
}
#priceDeluxe {
font-size: 50px;
font-family: "Pixelify Sans", Arial, Helvetica, sans-serif;
text-align: center;
}
#priceNormal {
font-size: 50px;
font-family: "Pixelify Sans", Arial, Helvetica, sans-serif;
text-align: center;
}

Код: Выделить всё

[*]

Yearly Membership|cosmicgames.fun



Yearly Membership

[url=membershippage.html]

arrow_back

[/url]

Membership Options:

[url=normalyearlymembership.htm]

Normal Membership
[list]
Lorem ipsum dolor sit amet.
[*]Lorem ipsum dolor sit amet.
[*]Lorem ipsum dolor sit amet.
[*]Lorem ipsum dolor sit amet.
[*]Lorem ipsum dolor sit amet.
[/list]
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Earum praesentium qui assumenda consectetur repellat consequatur voluptatibus minus eos et, culpa, in, nihil veritatis mollitia reiciendis quas. A temporibus architecto quis. Lorem ipsum dolor sit amet consectetur adipisicing elit. Id aut tenetur quo deleniti asperiores? Ut enim sunt nisi incidunt voluptatem error, earum, recusandae nam amet architecto iusto, vel esse modi.
$29.99

[/url]
[url=deluxeyearlymembership.htm]

Deluxe Membership
[list]
[*]Lorem ipsum dolor sit amet.
[*]Lorem ipsum dolor sit amet.
[*]Lorem ipsum dolor sit amet.
[*]Lorem ipsum dolor sit amet.
[*]Lorem ipsum dolor sit amet.
[/list]
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Earum praesentium qui assumenda consectetur repellat consequatur voluptatibus minus eos et, culpa, in, nihil veritatis mollitia reiciendis quas. A temporibus architecto quis. Lorem ipsum dolor sit amet consectetur adipisicing elit. Id aut tenetur quo deleniti asperiores? Ut enim sunt nisi incidunt voluptatem error, earum, recusandae nam amet architecto iusto, vel esse modi.
$39.99

[/url]

есть ответы?

Подробнее здесь: https://stackoverflow.com/questions/790 ... act-as-one