Question

I’m having some issues trying to write CSS to make a box float to the right of my page.

I have a div called #right-box-uploadphoto that is the grey box on this page http://s361608839.websitehome.co.uk/salesboard/After_Login.html

The CSS is this:

#right-box-uploadphoto{
width: 240px;
height: 240px;
background: #e6e6e6;
border: 1px solid #d7d7d7;
margin-left: 15px;
float: right;
}

It’s somehow being pushed down. It needs to line up with #page-box2.

Is this not right?

Thanks

Answer 1

You placed the div incorrectly on your page. Try adding your div to your mainFrame like:

<div id="mainFrame">
<h2>Set up your Salesboard</h2>
<p>There's only a few steps to go!</p>
<div class="line"></div> 
<div id="page-box2">
<div id="step-box-select"><span class="icon-step">1</span> Set Up Your Profile</div>
<div id="step-box-unselect"><span class="icon-step">2</span> Set Up Your Team</div>
<div id="step-box-unselect"><span class="icon-step">3</span> Add Team Member</div>
<br><br>
<form action="" method="get">


</form>
<a href="#" class="upgradebutton">Upgrade</a></div>
<div id="right-box-uploadphoto"></div>
</div>