   [web] 2 CSS problems...
  Hi,(1) My web page has two main divs: #top-banner, and #page-content. The #top-banner is where my nav menu as well as other info will be, including a logo image that I currently have sitting inside a div called #main-logo. I simply want the image/logo to have be 10 pixel offset from the top-left corner of #top-banner, but nothing I am doing is working. See code below.(2) The #top-banner div also has a nav menu called #menus. Right now, at least in Firefox, they are showing up directly below the #main-logo div. I want the #menus div to be pushed down to the bottom of the entire #top-banner and off to the right (maybe 50 pixels past dead-center).Here is the code for the page:<!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" />    </head>   <body><style type="text/css">    <!--body,td,th {font-family: Arial, Helvetica, sans-serif;font-size: 14px;}body {margin-left: 0px;margin-top: 0px;margin-right: 0px;margin-bottom: 0px;}a:link {text-decoration: none;}a:visited {text-decoration: none;}a:hover {text-decoration: underline;}a:active {text-decoration: none;}#top-banner{background-image: url(x.jpg);position: absolute;height: 165px;width: 100%;left: 0px;top: 0px;border-bottom-width: 1px;border-bottom-style: solid;border-bottom-color: #5A595A;}#main-logo{postition: absolute;border-top: 10px;border-left: 10px;}#menus a:link{color = rgb(0,255,0);}#menus {padding:0px;}#menus li {list-style:none;float:left;}#menus li a{color: rgb(0,255,0);font-weight: bolder;}#page-content{}.box{}.box h1{}.box ol{}#elevator-pitch{}#all-contact-forms{}-->    </style>   <div id="top-banner">  <div id="main-logo">  <a href="./DefaultGamma.php"><img src="y.jpg"/></a>  </div>  <ul id="menus"> <li><a class= "menu-link" href="./DefaultGamma.php">Home</a> :: </li> <li>&nbsp;<a class= "menu-link" href="./CompanyGamma.php">Company</a> :: </li> <li>&nbsp;<a class= "menu-link" href="./ServicesGamma.php">Services</a> :: </li> <li>&nbsp;<a class= "menu-link" href="./PhilosGamma.php">Philos</a></li>  </ul>   </div>   <div id="page-content">   </div>    </body></html>Please let me know if you have any suggestions. Here is a link to that page:http://abatherapyautism.com/m.phpThanks,ply   
Quote:Original post by plywood...I simply want the image/logo to have be 10 pixel offset from the top-left corner of #top-banner...#main-logo{   padding-top: 10px;   padding-left: 10px;}Quote:Original post by plywood...I want the #menus div to be pushed down to the bottom of the entire #top-banner and off to the right (maybe 50 pixels past dead-center)....#top-banner{   position: absolute;   height: 165px;   width: 100%;   ...}#menus {   position: absolute;   right: 50px;   bottom: 0px;   margin: 0px;   padding:0px;}