I am new to Dreamweaver. I am following Dreamweaver for Dummies. The problem
is that I have set up a page with a "container" div that is centered. Inside
is a "top" div, inside the "top" div are to divs, "topleft" and "topright".
The "topright" div style sheet formats the text correctly, and the box
formatting puts it to the right, but I can't get it to be at the top of the
"top" div so that "topright" and "topleft" are side by side, line up at the top.
What stupid thing am I missing here?
Here's the code (sorry its long)
<!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>Untitled Document</title>
<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++)
x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length;
i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document;
if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++)
x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++)
x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array;
for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc)
x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<script src="Scripts/AC_RunActiveContent.
js" type="text/javascript"></script>
<style type="text/css">
<!--
#container {
width: 790px;
margin-right: auto;
margin-left: auto;
}
#top {
width: 789px;
}
#topLeft {
width: 392px;
}
#topRight {
float: right;
width: 300px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #0077CC;
}
#container #navSideBar {
width: 146px;
}
-->
</style>
</head>
<body
onload="MM_preloadImages('images-bwsc/BWSCI-1-b_04.jpg','images-bwsc/BWSCI-1-b_0
5.jpg','images-bwsc/BWSCI-1-b_06.jpg','images-bwsc/BWSCI-1-b_07.jpg','images-bws
c/BWSCI-1-b_09.jpg','images-bwsc/BWSCI-1-b_10.jpg','images-bwsc/BWSCI-1-b_11.jpg
','images-bwsc/BWSCI-1-b_12.jpg')">
<div id="container">Content for id "container" Goes Here
<div id="top">
<div id="topLeft"><span class="top"><img
src="images-bwsc/BWSCI-1-a_01.jpg" alt="Best Western South Coast Inn logo"
width="392" height="145" /> </span></div>
<div id="topRight">FAQs<img src="images-bwsc/ico-arrow-topnav.gif"
alt="Arrow points upper right" width="11" height="11" /> Contact Us<img
src="images-bwsc/ico-arrow-topnav.gif" alt="Arrow points upper right"
width="11" height="11" /> Travel Card<img
src="images-bwsc/ico-arrow-topnav.gif" alt="Arrow points upper right"
width="11" height="11" /> BestWestern.com<img
src="images-bwsc/ico-arrow-topnav.gif" alt="Arrow points upper right"
width="11" height="11" /></div>
<div id="topRightLower"> <img src="images-bwsc/BWSCI-1-c_03.jpg" alt="Home
button" width="76" height="69" /><a href="#" onmouseout="MM_swapImgRestore()"
onmouseover="MM_swapImage('HotelRollOver','','imag es-bwsc/BWSCI-1-b_04.jpg',1)">
<img src="images-bwsc/BWSCI-1-a_04.jpg" alt="Hotel button" name="HotelRollOver"
width="68" height="69" border="0" id="HotelRollOver" /></a><a href="#"
onmouseout="MM_swapImgRestore()"
onmouseover="MM_swapImage('RatesRollOver','','imag es-bwsc/BWSCI-1-b_05.jpg',1)">
<img src="images-bwsc/BWSCI-1-a_05.jpg" alt="Rates and Reservations button"
name="RatesRollOver" width="159" height="69" border="0" id="RatesRollOver"
/></a><a href="#" onmouseout="MM_swapImgRestore()"
onmouseover="MM_swapImage('ContactUsRollOver','',' images-bwsc/BWSCI-1-b_06.jpg',
1)"><img src="images-bwsc/BWSCI-1-a_06.jpg" alt="Contact Us button"
name="ContactUsRollOver" width="94" height="69" border="0"
id="ContactUsRollOver" /></a></div>
</div>