Z
Zoid in Code
Enthusiast
Ok so I have 3 containers that contain a header and a small paragraph. I would like the 3 "containers" inline. How would I do so?
HTML:
CSS:
HTML:
HTML:
<div class="container">
<div class="content-main">
<br>
<h2> Big news at Unity Code ... </h2>
<p>Welcome to our new homepage. We have also updated our site
with new and improved code so please take a tour around our site
to see what we have been doing.<br><br>
An example of our updated code can be found on our <a href="#"> example</a> page.</p>
</div>
<br>
<div class="content-second">
<br>
<h2> New projects ... </h2>
<p>We have many new projects in development. More information can be found
on our <a href="#">projects</a> page<a href="#"></a>
<br><br>
If you wish to help us on any of our projects please visit our<a href="#"> developer</a>
page for more information.</p>
</div>
<br>
<div class="content-third">
<br>
<h2> New products coming soon ... </h2>
<p>New products are coming soon. Our new products are T-shrits, wristbands and custom posters</p>
</div>
</div>
CSS:
.content-main {
width: 350px;
height: 300px;
background-color: #DAD8D8;
border-radius: 8px;
font-family: ubuntu;
padding-left: 5px;
font-style: none;
text-decoration: none;
list-style-type: none;
}
.content-main a{
text-decoration: none;
list-style-type: none;
}
.content-second {
width: 500px;
height: 190px;
background-color: #DAD8D8;
border-radius: 8px;
font-family: ubuntu;
padding-left: 5px;
font-style: none;
text-decoration: none;
list-style-type: none;
}
.content-second a{
text-decoration: none;
list-style-type: none;
}
.content-third{
width: 500px;
height: 190px;
background-color: #DAD8D8;
border-radius: 8px;
font-family: ubuntu;
padding-left: 5px;
font-style: none;
text-decoration: none;
list-style-type: none;
}
.content-third a {
text-decoration: none;
list-style-type: none;
}
Last edited by a moderator: