Lo que pasa es que adapte este diseño:
http://www.freecsstemplates.org/preview/cattleya/
Pero lo que pasa es que me sale mal adaptado en la forma que sale el titulo de mi web y los link desplegados en el area de contenido, aqui se muestra:
http://designmev.es.tl/Home.htm
O miren esta imagen que le tome al diseño:
<br />
<img alt="" src="http://img.webme.com/pic/d/designmev/cateya.png" /><br />
Por favor se lo suplico que me den una mano, ya que espara una web de programas online.
A continuacion aqui esta el codigo de lo q adapte:
Código: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
Title : Catteleya
Version : 1.0
Released : 20091227
Description: A two-column fixed-width template suitable for small websites.
-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Catteleya by Free Css Templates</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="default.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="wrapper">
<div id="header">
<div id="logo">
<h1><a href="#">Catteleya</a></h1>
<h2><a href="http://www.freecsstemplates.org/">By Free CSS Templates</a></h2>
</div>
<!-- end div#logo -->
</div>
<!-- end div#header -->
<div id="menu">
<ul>
<li class="active"><a href="#">Home</a></li>
<li><a href="#">Products</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
<!-- end div#menu -->
<div id="page">
<div id="page-bgtop">
<div id="content">
<div class="post">
<h2 class="title"><a href="#">Lorem Ipsum Dolor Volutpat</a></h2>
<p class="byline">Posted by FreeCssTemplates</p>
<div class="entry">
Código: </div>
<div class="meta">
<p class="links"><a href="#" class="comments">Comments (32)</a></p>
</div>
</div>
</div>
<!-- end div#content -->
<div id="sidebar">
<ul>
<li id="search">
<h2>Search</h2>
<form method="get" action="">
<fieldset>
<input type="text" id="search-text" name="s" value="" />
<input type="submit" id="search-submit" value="Search" />
</fieldset>
</form>
</li>
<li>
<h2>Lorem Ipsum</h2>
<ul>
<li><a href="#">Fusce dui neque fringilla</a></li>
<li><a href="#">Eget tempor eget nonummy</a></li>
<li><a href="#">Magna lacus bibendum mauris</a></li>
<li><a href="#">Nec metus sed donec</a></li>
<li><a href="#">Magna lacus bibendum mauris</a></li>
<li><a href="#">Velit semper nisi molestie</a></li>
<li><a href="#">Eget tempor eget nonummy</a></li>
</ul>
</li>
<li>
<h2>Volutpat Dolore</h2>
<ul>
<li><a href="#">Nec metus sed donec</a></li>
<li><a href="#">Magna lacus bibendum mauris</a></li>
<li><a href="#">Velit semper nisi molestie</a></li>
<li><a href="#">Eget tempor eget nonummy</a></li>
<li><a href="#">Nec metus sed donec</a></li>
<li><a href="#">Magna lacus bibendum mauris</a></li>
<li><a href="#">Velit semper nisi molestie</a></li>
</ul>
</li>
<li>
<h2>Bebindum Mauris </h2>
<ul>
<li><a href="#">Nec metus sed donec</a></li>
<li><a href="#">Magna lacus bibendum mauris</a></li>
<li><a href="#">Velit semper nisi molestie</a></li>
<li><a href="#">Eget tempor eget nonummy</a></li>
<li><a href="#">Nec metus sed donec</a></li>
<li><a href="#">Velit semper nisi molestie</a></li>
<li><a href="#">Eget tempor eget nonummy</a></li>
<li><a href="#">Velit semper nisi molestie</a></li>
</ul>
</li>
</ul>
</div>
<!-- end div#sidebar -->
<div style="clear: both; height: 1px"></div>
</div>
</div>
<!-- end div#page -->
<div id="footer">
<p>Copyright © 2007 Catteleya. All Rights Reserved. Designed by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a>. <a href="#">Privacy Policy</a> | <a href="#">Terms of Use</a></p>
</div>
<!-- end div#footer -->
</div>
<!-- end div#wrapper -->
</body>
</html>
Código:
/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/
* {
margin: 0;
padding: 0;
}
body {
margin: 0px;
background: #F5F5F5 url(http://img.webme.com/pic/d/designmev/cateya01.jpg) repeat-x left top;
text-align: justify;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
color: #4D4D4D;
}
h1, h2, h3 {
color: #AA2808;
}
h1 {
}
h2 {
}
h3 {
}
p, blockquote, ul, ol {
margin-bottom: 20px;
line-height: 2em;
}
p {
}
blockquote {
}
ul, ol, li {
margin: 0px;
padding: 0px;
list-style: none;
}
a {
text-decoration: underline;
color: #00A8E9;
}
a:hover {
text-decoration: none;
color: #838383;
}
/* Wrapper */
#wrapper {
}
/* Header */
#header {
width: 960px;
height: 70px;
margin: 0 auto;
}
/* Logo */
#logo {
float: left;
width: 270px;
height: 70px;
margin: 0px;
padding-left: 30px;
}
#logo h1 {
margin: 0;
padding: 0;
font: normal 36px Georgia, "Times New Roman", Times, serif;
}
#logo h2 {
margin: -2px 0 0 0;
padding: 0;
text-transform: uppercase;
letter-spacing: 2px;
font-size: 10px;
font-weight: bold;
color: #FFFFFF;
}
#logo a {
text-decoration: none;
color: #FFFFFF;
}
/* Menu */
#menu {
width: 960px;
height: 60px;
margin: 0 auto;
background: url(http://img.webme.com/pic/d/designmev/cateya02.jpg) no-repeat left top;
}
#menu ul {
margin: 0;
padding: 20px 0 0 0px;
list-style: none;
line-height: normal;
margin-left: 30px;
}
#menu li {
display: inline;
text-align: center;
}
#menu a {
display: block;
float: left;
margin-right: 3px;
padding: 5px 20px 5px 20px;
text-decoration: none;
text-align: center;
text-transform: uppercase;
font-size: 11px;
font-weight: bold;
color: #525252;
}
#menu a:hover, #menu .active a {
background: #FFFFFF;
color: #525252;
}
#splash {
width: 940px;
height: 299px;
margin: 0 auto;
}
/* Search */
#header-search {
width: 940px;
height: 51px;
margin: 0 auto;
padding: 0px 0px 0px 0px;
}
#header-search form {
float: right;
width: 300px;
margin: 0;
padding: 12px 0px 0px 0px;
}
#header-search fieldset {
margin: 0;
padding: 0;
border: none;
}
#header-search-text {
width: 200px;
padding: 2px 3px;
background: #1E1E1E;
border: none;
color: #4D4D4D;
}
#header-search-submit {
background: none;
border: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #E4E4E4;
}
#search {
height: 51px;
margin: 0 auto;
padding: 0px 0px 60px 0px;
}
#search form {
margin: 0;
padding: 12px 0px 0 0;
}
#search fieldset {
margin: 0;
padding: 0;
border: none;
}
#search input {
float: left;
font: 12px Arial, Helvetica, sans-serif;
}
#search-text {
width: 160px;
height: 18px;
padding: 3px 0 3px 5px;
border: none;
color: #000000;
}
#search-submit {
margin-left: 10px;
padding: 4px 4px;
border: none;
background: #000000;
color: #FFFFFF;
}
/* Page */
#page {
width: 960px;
margin: 0 auto;
background: url(http://img.webme.com/pic/d/designmev/cateya03.jpg) repeat-y left top;
}
#page-bgtop {
padding: 0px 0px 0px 20px;
}
/* Content */
#content {
float: left;
width: 580px;
padding-top: 30px;
}
.post {
margin: 0px 0px 30px 0px;
}
.post .title {
margin: 0px;
padding: 0px 0px 5px 0px;
color: #232F01;
}
.post .title a {
padding: 4px 35px 4px 15px;
background: #8DD006;
text-decoration: none;
font-weight: normal;
color: #FFFFFF;
}
.post .entry {
padding: 20px 0px;
}
.post img {
float: left;
padding: 15px 0px;
}
.post .meta {
text-align: right;
padding: 0px 0 20px 0;
font-weight: bold;
color: #202020;
}
.post .byline {
float: right;
margin-top: -30px;
font-size: 12px;
color: #5E5E5E;
}
/* Sidebar */
#sidebar {
float: right;
width: 240px;
margin: 20px 0px;
padding: 30px 30px 30px 30px;
background: #212121;
}
#sidebar ul {
margin: 0;
padding: 0;
list-style: none;
line-height: normal;
}
#sidebar li {
margin-bottom: 1px;
}
#sidebar li ul {
margin: 0px;
padding: 0px 0px 40px 0px;
}
#sidebar li li {
margin: 0;
padding: 9px 0px;
border: none;
border-bottom: 1px solid #171717;
}
#sidebar h2 {
margin: 0px;
padding: 0px 0px 20px 0px;
font-family: "Times New Roman", Times, serif;
font-size: 160%;
font-weight: normal;
color: #FFFFFF;
}
#sidebar h3 {
font-size: 77%;
color: #110404;
}
#sidebar p {
margin: 0;
line-height: normal;
color: #D4C792;
}
#sidebar a {
border: none;
text-decoration: none;
color: #BFBFBF;
}
#sidebar a:hover {
text-decoration: underline;
}
/* Submenu */
#submenu {
}
/* News */
#news {
}
#news a {
font-size: 85%;
}
/* Footer */
#footer {
width: 960px;
height: 100px;
margin: 0 auto;
padding: 14px 0px 0px 0px;
background: url(http://img.webme.com/pic/d/designmev/cateya04.jpg) no-repeat left top;
color: #9C9C9C;
}
#footer p {
margin: 0;
text-align: center;
font-size: 77%;
}
#footer a {
text-decoration: underline;
color: #808080;
}
#footer a:hover {
text-decoration: none;
}