Drew Easton
Drew Easton

Reputation: 11

How to align boxes in a row in HTML and CSS on my webpage?

My webpage on my new website at http://www.innovacomputingsoftware.com/products/inol.html is for one of my products. I can't get the second, "About" box to be to the right of the first one. Instead, it is to the right and below it by one line. How do I fix this in HTML and CSS? The code for the webpage is-

    <html>
<head>
<title>Innova Computing Software</title>
<meta name="description" content="Innova Computing Software is a small, American company aimed at making quality software that is cheap or free." />
<style>
.boxed {
    background-color : #C3C3C3 ;
    border: 1px solid #008000;
    width: 414px;
}
</style>
</head>
<body bgcolor="gray">
<a href="http://innovacomputingsoftware.com/index.htm"><img src="logo.png"></img></a>
<a href="/about/index.html"><img src="about.png"></img></a>
<a href="/products/index.html"><img src="products.png"></img></a>
<a href="help.htm"><img src="help.png"></img></a>
<a href="contact.htm"><img src="contact.png"></img></a>
<br>
<br><img src="dividerbar.png"></img>
<br>
<br>
<div class="boxed">
<br><center><font size="7" face="arial" color="red">About</font></center>
</div>
<center>
<div class="boxed"><center><font size="7" face="arial" color="red">About</font></center>
</div>
</center>
<br>
<br>
<br>
<br>
<br><font face="arial" size="1">Coded and served by Drew Easton.  You do not have permission to reproduce or alter any of the 
<br>content provided to you within this website under any circumstances, unless otherwise stated by
<br> the owners of this server and the authors of the content which you view.</font>
</body>
</html>

Upvotes: 1

Views: 75

Answers (1)

shadeed9
shadeed9

Reputation: 1826

.boxed element is a div which is by default displayed in a new line. You can float it and you will get the other item next to it.

.boxed {
  float: left;
}

Upvotes: 1

Related Questions