im discovering html css receptive website design and also developed 3 drifted columns to the entrusted to a size of 33.33% size so they line up beside each various other on computer systems and also they pile on tools with a max-width of 700px. i placed an elevation of 100% on them all and also it was going great up until i focused advertisement the message began dripping out of the column
HTML
<.
<< html>>.
<< head>>.
<< meta charset=" utf-8">
<> < title>> replit<.
<< meta name=" viewport" material=" size= device-width initial-scale= 1.0">>.
<< web link href=" style.css" rel=" stylesheet"/>
<> .
<< body>>.
<< div course=" header">
<> < h1>> Advantages of Random Points<.
<.
<< div course=" row">
<> < div course=" column1 column-m1">>.
<< h2>> The effect of social media sites on psychological wellness<.
<< p> > Social network has actually come to be an essential component of our lives, and also it has both favorable and also unfavorable impacts on our psychological wellness. Some research studies recommend that social media sites can bring about stress and anxiety, anxiety, and also various other psychological illness, while others say that it can be a resource of assistance and also link for individuals that are battling with psychological wellness concerns. What do you assume?<.
<.
<< div course=" column2 column-m2">>.
<< h2>> The advantages of reflection<.
<< p>> Reflection is a technique that has actually been around for countless years, and also it has several advantages for our physical and also psychological wellness. Some research studies recommend that reflection can help in reducing stress and anxiety, stress and anxiety, and also anxiety, while others say that it can boost our emphasis, creative thinking, and also general health. Have you ever before attempted reflection? What was your experience like?<.
<.
<< div course=" column3 column-m3">>.
<< h2>> The future of area expedition. <.
<< p>> Area expedition has actually come a lengthy means considering that the initial human came down on the moon in 1969, and also there are several amazing growths imminent. Personal firms like SpaceX are functioning to make area traveling a lot more easily accessible, while NASA is intending to send out people to Mars in the coming years. What do you assume the future of area expedition will resemble? What are a few of the obstacles that we will require to get rid of?<.
<.
<.
<< div course=" footer">
<> < h1>> Say goodbye to:&&# 40; .
<.
<.
<.
CSS
body {
margin: 0;
extra padding: 0;
}
. row:: after {
material: "";
screen: block;
clear: both;
}
* {
box-sizing: border-box;
}
. header {
boundary: 1px strong black;
background-color: #b 1afaf;
}
. header h1 {
text-align: facility;
font-size: 35px;
}
[class*="column"] {
margin: 0;
float: left;
size: 33.33%;
extra padding: 15px;
boundary: 1px strong black;
elevation: 100%;
}
h2 {
text-align: facility;
font-size: 31px;
}
p {
font-size: 30px;
}
. column1,. column3 {
background-color: grey;
}
. column2 {
background-color: #b 1afaf;
}
. footer {
background-color: #b 1afaf;
extra padding: 5px;
text-align: facility;
boundary: 1px strong black;
}
@media just display and also (max-width: 700px) {
[class*="column-m"] {
size: 100%;
extra padding: 10px;
}
. column-m1 p,.column-m2 p,.column-m3 p {
font-size: 23;
}
}
i assumed that the drifts were dripping out of package so i utilized a clearfix strategy however that didnt job, all i demand is for the columns to extend and also touch the footer and also the message not leakage from it when i focus. Sickness taake any type of assistance i can obtain please.
