|
Posted by Luciano A. Ferrer on June 7, 2006, 7:39 pm
Please log in for more thread options
Luciano A. Ferrer ha escrito lo siguiente el 07/06/2006 17:04:
> Hi, I am trying to achieve this simple layout
> http://img478.imageshack.us/my.php?image=boceto2ah.gif
>
> and I have problems with the navigation div (the numbers)
> btw, the right way its somthing like
> 1234
> 5678
> at bottom of that line, not vertical like that image
>
>
> and this is the 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>
> <title>hola mundo</title>
> <meta http-equiv="Content-Type" content="text/html;
> charset=iso-8859-1" />
> <style>
> <!--
> body, html {
> margin: 15px 0 0 0;
> padding: 0;
> background: #fff;
> color: #000;
> }
>
> body {
> min-width: 764px;
> }
>
> #contain {
> background: #fff;
> margin: 0 auto;
> width: 764px;
> height: 419px;
> }
>
> #main {
> background: #514c38;
> float: left;
> width: 382px;
> height: 419px;
> font: .7em Verdana, Geneva, Arial, Helvetica, sans-serif;
> color: #eeeeee;
> }
>
> #content {
> float: right;
> width: 290px;
> text-align: right;
> padding: 0 10px 0 0;
> }
>
> #content h2, #content h3 {
> padding: 0;
> margin: 0;
> color: #35ad9b;
> font-weight: bold;
> font-size: 1.1em;
> }
>
> #buttons {
> float: left;
> padding: 0;
> margin: 0 0 0 18px;
> width: 60px;
> height: 34px;
> }
>
> #navigation {
> position: relative;
> bottom: 0;
> padding: 0;
> margin: 0;
> width: 382px;
> height: 10px;
> text-align: right;
> border: 1px solid #cccccc;
> }
>
> #navigation ul{
> margin:0;
> padding:0;
> list-style:none;
> }
>
> #navigation li{
> display:inline;
> margin:0;
> padding:0;
> }
>
> #mainimage {
> float: right;
> width: 382px;
> background: #99c;
> }
>
> #mainimage ul {
> margin-bottom:0;
> }
>
> #mainimage h3, #mainimage p {
> padding:0 10px 0 0;
> }
> //-->
> </style>
>
> </head>
> <body>
> <div id="contain">
> <div id="main">
> <img src="/imagenes/cabecera.gif" alt="" width="382" height="85" />
>
> <div id="content">
> <h2>Nombre del cliente</h2>
> Ejemplo descripción cliente<br /><br />
> Gran mate para tomar mucho mate y más mate,<br />
> mate.
> </div>
>
> <div id="buttons">
> <img src="/imagenes/enlacecontacto.gif" alt="" width="60" height="17" />
> <img src="/imagenes/enlaceportfolio.gif" alt="" width="60" height="17" />
> </div>
>
> <div id="navigation">asdsas acá los números</div>
> </div>
> <div id="mainimage"><img src="/images/granmate.jpg" alt=""
> align="top"/></div>
>
> </div>
>
> </body>
> </html>
>
>
> I was trying to put the bottom of #navigation equal than the bottom
> of #main... using bottom: 0;
> but I have no idea on how to do it...
well, I solve it making main relative and navigation absolute...
--
Luciano A. Ferrer
laferrerQuiTadme@SacaDMEgmail.com
http://relojurbano.com.ar .algún día volverás.
... Velador elástica mueca
| 
XML Sitemap