hey guys having a little trouble with positioning some text on a webpage i'm building very simple page just a video small menu and some text. i just want to the small block of text to appear below the menu to the right of the video not under the video. any help with this would be much appreciated.
http://transitionexhibition.co.uk
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Transition</title>
<link type="text/css" rel="stylesheet" href="style.css" />
</head>
<body style="background-color:#1A1A1A;">
<!--<iframe width="1000" title="YouTube video player" src="http://www.youtube.com/embed/60D-u4BuWoo?modestbranding=1;showinfo=0;HD=1;rel=0;showinfo=0;autoplay=1;controls=0" frameborder="0"></iframe>
-->
<div id="menu">
<ul>
<li><a href='events.html'>Events</a></li>
<li><a href='artists.html'>Artists</li>
<li><a href='index.html'>Home</a></li>
</ul>
</div>
<div style=""><video style="margin:0px auto;" width="70%" height="auto" autoplay="1">
<!-- MP4 must be first for iPad! -->
<source src="WEBREADY.mp4" type="video/mp4" /><!-- Safari / iOS video -->
<source src="__VIDEO__.OGV" type="video/ogg" /><!-- Firefox / Opera / Chrome10 -->
<!-- fallback to Flash: -->
<!-- fallback image. note the title field below, put the title of the video there -->
</video>
<p style="float:right;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nec justo a turpis lacinia ornare. Cras iaculis fringilla lorem, et feugiat diam feugiat sit amet. Quisque nibh ante, eleifend eu sapien. Maecenas at suscipit elit. Integer porttitor blandit elit, a gravida velit rhoncus vitae. Etiam tempus commodo iaculis. Donec faucibus elit a lorem tempor at auctor magna suscipit. Curabitur cursus, lectus nec pulvinar tristique, lorem dolor fermentum dolor, non faucibus dui felis id odio. Aliquam nunc sapien, imperdiet ac tempor at, tincidunt at turpis. Ut ornare molestie est et tincidunt. Nunc risus est, porta sed bibendum et, pharetra vel libero. Aliquam in libero ante. Nam ut turpis vitae magna pulvinar pharetra. Nunc non hendrerit arcu.
</p>
</div>
<!-- you *must* offer a download link as they may be able to play the file locally. customise this bit all you want -->
</body>
</html>
Code:
@charset "UTF-8";
/* CSS Document */
#menu Li{
font-size: 25px;
font-style: normal;
color:#F0F0F0;
text-align: center;
height: auto;
width: auto;
margin-top: 20px;
margin-right:50px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
position: relative;
list-style-type: none;
display:inline-block;
font-family:"monaco", monospace;
float:right;
}
p{font-size:14px;
font-style: normal;
color:#F0F0F0;
text-align: left;
height: auto;
width: auto;
margin-top: 5px;
margin-right:30%;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
position: relative;
}
img{
padding-right: 30px;
float:left;}
a { color:inherit;
text-decoration:none;
}
a:hover{
color:#999;
}
a:active{
color:white;
}h1 {
font-family: monaco;
font-size: 20px;
color: #F0F0F0;
text-align: left;
display: none;
position: relative;
}
#events{
padding-left: 100px;
padding-right: 100px;
position:relative;
top: 120px;
}
#artists{
padding-left: 100px;
padding-right: 100px;
position:relative;
top: 120px;
}
Before you post, read our: 
