#8 Re: [Dreamweaver] Alto de tablas
Y tenés que usar tablas??
Podés conseguir el mismo layout (de echo, no lo conseguias..) con css:
Con esto tenés lo básico, que la columna quede a todo el alto de la página, y ubicás el logo abajo a la derecha.
El XHTML:
Código PHP:
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>titulo</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="style.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div id="logo"></div>
</body>
</html>
La hoja de estilo:
Código PHP:
* {
padding: 0;
margin: 0;
}
body {
background: #EFEFEF url('777wws.gif') repeat-y right;
}
#logo {
position: absolute;
right: 20px;
bottom: 20px;
height: 91px;
width: 251px;
background: #FFFFFF url('logooo.gif') no-repeat center;
}
Pero la idea es que si ya empezás a usar CSS, lo uses con todo y no que agregues el div, y lo posiciones con "absolute" (tambien podrias probar con fixed), a un diseño con tablas tan Dreamweaver...
Asi que aca tenés un ejemplo con algunas cosas mas:
Código PHP:
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>titulo</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="style.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div id="contenedor">
<div id="menu">
<ul>
<li><a href="#1" title="1">» 1</a></li>
<li><a href="#2" title="2">» 2</a></li>
<li><a href="#3" title="3">» 3</a></li>
<li><a href="#3" title="4">» 4</a></li>
<li><a href="#4" title="5">» 5</a></li>
</ul>
</div>
<div id="contenido">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Mauris luctus iaculis tortor. Maecenas eu urna id tellus adipiscing pulvinar. In pellentesque consequat pede. Nullam lorem urna, rutrum sed, lacinia sed, pellentesque id, turpis. Donec luctus tincidunt lorem. Integer accumsan rutrum est. Morbi viverra molestie eros. Phasellus eu pede. Mauris tempor arcu. Vestibulum quis tellus. Pellentesque in erat eu felis faucibus fringilla. Nulla eget justo.
Integer eros. Nullam ornare, nisl et pulvinar fringilla, metus eros pharetra velit, ac feugiat turpis dui sit amet purus. Sed arcu arcu, lacinia egestas, iaculis et, rutrum nec, libero. Proin tincidunt fermentum mauris. Vivamus odio. Quisque arcu lectus, consectetuer eget, tristique sit amet, bibendum feugiat, est. Donec ut nulla eget turpis vestibulum rhoncus. Nam mauris leo, tristique et, pretium posuere, tempor in, mi. Nullam sapien erat, interdum eget, adipiscing in, varius id, dolor. Nullam feugiat leo.
</div>
<div id="logo"></div>
</div>
</body>
</html>
Código PHP:
* {
padding: 0;
margin: 0;
}
body {
background: #EFEFEF url('777wws.gif') repeat-y right;
}
#logo {
position: absolute;
right: 20px;
bottom: 20px;
height: 91px;
width: 251px;
background: #FFFFFF url('logooo.gif') no-repeat center;
}
#menu {
float: right;
margin-top: 20px;
margin-right: 20px;
}
#contenido {
margin: 10px;
width: 70%;
}
Saludos!
