Hola a todos, en primer lugar enhorabuena por el foro, llevo tiempo consultandolo y hoy me he registrado, a ver si me podéis ayudar con una web que estoy haciendo.
El problema es que la div "pie" no es visible, esta justo debajo de una que contiene un iframe, no se si esa será la razón...
Os dejo el css:
html, body {
background: #2d2620;
text-align: center;
margin: 0px;
height: 100%;
width: 100%;
}
#wrap {
margin-left: auto;
margin-right: auto;
width: 900px;
position: relative;
background: url(body.jpg) center no-repeat;
height: 160px;
}
#body-image {
margin-top: 60px;
}
#main-nav {
margin: 0px 0px 0px 2px;
text-align: left;
min-height: 25px;
padding-top: 10px;
padding-left: 0px;
}
#main-handle {
width: 605px;
float: right;
margin-top: -1px;
}
#main-nav li {
display: inline;
list-style: none;
}
#main-nav li a {
margin-right: 5px;
font-size: 12px;
text-decoration: none;
color: #Ffd501;
font-family: Arial, Helvetica, sans-serif;
text-transform: uppercase;
font-weight: bold;
padding: 5px;
outline: 0;
position: relative;
top: -2px;
}
#main-nav li a:hover, #main-nav li a.active {
background: #514539;
}
#sub-link-bar {
background: #514539;
min-height: 10px;
border-bottom: #645546 1px solid;
}
.sub-links {
display: none;
position: absolute;
width: 100%;
top: -30px;
text-align: left;
left: 0px;
}
#main-nav li .sub-links li a:hover{
background: #2d2620;
}
#main-nav li a.close{
display: none;
position: absolute;
}
#main-nav li a.close:hover{
background: #900;
}
.round {
display:block
}
.round * {
display:block;
height:1px;
overflow:hidden;
font-size:.01em;
background:#645546
}
.round1 {
margin-left:3px;
margin-right:3px;
padding-left:1px;
padding-right:1px;
border-left:1px solid #443a30;
border-right:1px solid #443a30;
background:#56493c
}
.round2 {
margin-left:1px;
margin-right:1px;
padding-right:1px;
padding-left:1px;
border-left:1px solid #322a23;
border-right:1px solid #322a23;
background:#594c3e
}
.round3 {
margin-left:1px;
margin-right:1px;
border-left:1px solid #594c3e;
border-right:1px solid #594c3e;
}
.round4 {
border-left:1px solid #443a30;
border-right:1px solid #443a30
}
.round5 {
border-left:1px solid #56493c;
border-right:1px solid #56493c
}
.roundfg {
background:#645546
}
#iframe {
position:relative;
width:700px;
height:279px;
z-index:1;
margin-left:auto;
margin-right:auto;
}
#apDiv2 {
position:absolute;
width:725px;
height:115px;
z-index:1;
left: 88px;
top: 162px;
color: #FFF;
Background: transparent;
}
#apDiv3 {
position:relative;
width:700px;
height:70px;
z-index:1;
margin-left:auto;
margin-right:auto;
color: #FFF;
font-size: 11px;
font-family: Arial, Helvetica, sans-serif;
text-align: justify;
}
#pie {
position:relative;
width:500px;
height:50px;
z-index:1;
margin-left:auto;
margin-right:auto;
color: #C60;
font-size: 11px;
font-family: Arial, Helvetica, sans-serif;
text-align: center;
visibility: visible;
}
Y el html:
<!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>__TABITEK__</title>
<link rel="stylesheet" type="text/css" href="css/style02.css" />
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
<script type='text/javascript' src='js/links02.js'></script>
</head>
<body>
<div id="sub-link-bar"> </div>
<div id="wrap">
<div id="main-handle">
<div class="roundfg">
<ul id="main-nav">
<li><a class="main-link" href="http://net.tutsplus.com/">Inicio</a>
<ul class="sub-links">
<li><a class="main-link" href="http://net.tutsplus.com/">Home</a></li>
</ul>
</li>
<li><a class="main-link" href="http://net.tutsplus.com/category/tutorials/">Empresa</a>
<ul class="sub-links">
<li><a href="http://net.tutsplus.com/category/tutorials/design-tutorials/" title="View all posts filed under Design">Empresa</a> </li>
</ul>
</li>
<li><a class="main-link" href="http://net.tutsplus.com/category/articles/">Productos</a>
<ul class="sub-links">
<li ><a href="" title="Tabitek80" >Tabitek80</a> </li>
<li><a href="" title="Tabitek90" >Tabitek90</a> </li>
<li><a href="" title="Tabitek100">Tabitek100</a> </li>
<li><a href="" title="Tabitek100">Tabitek100</a> </li>
<li><a href="" title="Tabitek glass">Tabitek glass</a> </li>
<li><a href="" title="Tabitek moveo">Tabitek moveo</a> </li>
<li><a href="" title="Tabitek variflex">Tabitek variflex</a> </li>
<li><a href="" title="Tabitek variplan">Tabitek variplan</a> </li>
</ul>
</li>
<li><a class="main-link" href="http://net.tutsplus.com/category/freebies/">Apilamientos</a>
<ul class="sub-links">
<li><a href="http://net.tutsplus.com/category/freebies/books/" title="View all posts filed under Books">Books</a> </li>
<li><a href="http://net.tutsplus.com/category/freebies/icons-freebies/" title="View all posts filed under Icons">Icons</a> </li>
<li><a href="http://net.tutsplus.com/category/freebies/lightboxes/" title="View all posts filed under Lightboxes">Lightboxes</a> </li>
<li><a href="http://net.tutsplus.com/category/freebies/others/" title="View all posts filed under Others">Others</a> </li>
<li><a href="http://net.tutsplus.com/category/freebies/plugins/" title="View all posts filed under Plugins">Plugins</a> </li>
<li><a href="http://net.tutsplus.com/category/freebies/themes/" title="View all posts filed under Themes">Themes</a> </li>
<li><a href="http://net.tutsplus.com/category/freebies/tooltips/" title="View all posts filed under Tooltips">Tooltips</a> </li>
</ul>
</li>
<li><a class="main-link" href="http://net.tutsplus.com/category/videos/">Galería</a>
<ul class="sub-links">
<li><a href="http://net.tutsplus.com/category/videos/screencasts/" title="Screencasts">Screencasts</a> </li>
</ul>
</li>
<li><a class="main-link" href="http://net.tutsplus.com/about">Contacto</a>
<ul class="sub-links">
<li><a href="http://net.tutsplus.com/about/" title="About">About</a></li>
<li><a href="http://net.tutsplus.com/about/join-plus/" title="Join Plus">Join Plus</a></li>
<li><a href="http://net.tutsplus.com/about/rss-feeds/" title="RSS Feeds">RSS Feeds</a></li>
<li><a href="http://net.tutsplus.com/about/submissions/" title="Submit a Freebie">Submit a Freebie</a></li>
<li><a href="http://net.tutsplus.com/about/terms/" title="Terms">Terms</a></li>
<li><a href="http://net.tutsplus.com/about/write-a-tutorial/" title="Write a Tutorial">Write a Tutorial</a></li>
</ul>
</li>
<li><a class="close" title="Click to Collapse" href="#">X</a></li>
</ul>
</div>
<b class="round"> <b class="round5"></b> <b class="round4"></b> <b class="round3"></b> <b class="round2"><b></b></b> <b class="round1"><b></b></b></b> </div>
</div>
<div id="apDiv3">
<p></p>
</div>
<div id="iframe"> <iframe src="example.html" allowtransparency="true" scrolling="no" frameborder="0" width="700" height="279" align="center">
</div>
<div id="pie">
<p>Tabitek S.L. Instalación de tabiques móviles<br />Copyright 2010</p>
</div>
<!-- End wrap -->
</body>
</html>
Muchas gracias a todos de antemano.
