Duda Propiedad css header

tuka_85 · #1 (**permalink**) 07/11/2011, 18:32

http://img819.imageshack.us/img819/5137/capturaxq.png

Como veis en la imagen, tengo un problema en el header. Necesito saber cual es la propiedad para los margenes, ya que la tabla entre el logo y el titulo no me deja agrandarla mas, y me parece que es algo de los margenes del menu (Inicio, sobre mi, contacto..)

Si necesitais que os pegue algo de codigo em decis, pero con que me digais la propiedad imagino que lo pueda arreglar yo.

Muchas gracias!

alexk · #2 (**permalink**) 07/11/2011, 20:45

la propiedad de margen es "margin" XD... no se que es lo que necesitas exactamente pero puedes encontrar mucha ayuda en este link
http://librosweb.es/...
si aun no lo consigues pon todo el codigo implicado para ayudarte mejor

tuka_85 · #3 (**permalink**) 08/11/2011, 00:37

Igual es que no me he explicado bien. Quiero poner el logo mas arriba en la misma linea que el tituloy las letras de abajo se supone que tambien van en el header.

Bueno os pongo el css por si me podeis echar un cable...

Código:


body {
	margin: 0;
	padding: 0;
	background: #FFF3E3 url(images/img01.gif) repeat-x left top;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
	color: #3F3F3F;
}

h1, h2, h3 {
	margin: 0;
	padding: 0;
	font-weight: normal;
	color: #810988;
}

h1 {
	font-size: 2em;
}

h2 {
	font-size: 2.8em;
}

h3 {
	font-size: 1.6em;
}

p, ul, ol {
	margin-top: 0;
	line-height: 240%;
}

ul, ol {
}

a {
	text-decoration:none;
	color:#06F;
}

a:hover {
	
}

#wrapper {
	background: url(../images/img02.jpg) no-repeat center 115px;
}

.container {
	width: 1000px;
	margin: 0px auto;
}

/* Header */

#header {
	width: 900px;
	height: 115px;
	margin: 0px auto;
	padding: 0px 50px;
}

/* Logo */

#logo {
	float: left;
	width: 350px;
	margin: 0;
	padding: 0;
	color: #FFFFFF;
}

#logo h1, #logo p {
}

#logo h1 {
	padding: 30px 0px 0px 0px;
	letter-spacing: -3px;
	text-transform: lowercase;
	font-size: 4.8em;
}

#logo h1 a {
	text-shadow: 1px 1px 1px #C76200;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: italic;
	color: #FFFFFF;
}

#logo p {
	margin: 0;
	padding: 0px 0 0 0px;
	letter-spacing: 1px;
	text-shadow: 1px 1px 1px #C76200;
	text-transform: uppercase;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
	color: #FFFFFF;
}

#logo p a {
	color: #FFFFFF;
}

#logo a {
	border: none;
	background: none;
	text-decoration: none;
	color: #000000;
}

/* Splash */

#splash {
	width: 960px;
	height: 300px;
	margin: 0px auto;
}

/* Search */

#search {
	float: right;
	width: 280px;
	height: 60px;
	padding: 20px 0px 0px 0px;
}

#search form {
	height: 41px;
	margin: 0;
	padding: 10px 0 0 20px;
}

#search fieldset {
	margin: 0;
	padding: 0;
	border: none;
}

#search-text {
	width: 170px;
	padding: 6px 5px 2px 5px;
	border: 1px solid #E7EBED;
	background: #FFFFFF;
	text-transform: lowercase;
	font: normal 11px Arial, Helvetica, sans-serif;
	color: #5D781D;
}

#search-submit {
	width: 50px;
	height: 22px;
	border: none;
	background: #B9B9B9;
	color: #000000;
}

/* Menu */

#menu {
	float: right;
	width: 500px;
	height: 90px;
	margin: 0 auto;
	padding: 0;
}

#menu ul {
	float: right;
	margin: 0;
	padding: 70px 0px 0px 0px;
	list-style: none;
	line-height: normal;
}

#menu li {
	float: left;
}

#menu a {
	display: block;
	height: 20px;
	margin-right: 1px;
	padding: 0px 20px 15px 20px;
	letter-spacing: 1px;
	text-decoration: none;
	text-align: center;
	text-shadow: 1px 1px 1px #C76200;
	text-transform: uppercase;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 13px;
	font-weight: normal;
	color: #FFFFFF;
	border: none;
}

#menu a:hover, #menu .current_page_item a {
	text-decoration: none;
	color: #FFFFFF;
}

#menu .current_page_item a {
}

/* Page */

#page {
	width: 900px;
	margin: 0 auto;
	padding: 30px 30px;
}

/* Content */

#content {
	float: left;
	width: 590px;
	padding: 50px 0px 0px 0px;
}

.post {
	overflow: hidden;
	margin-bottom: 20px;
	border-bottom: 1px solid #E7EBED;
}

.post .title {
	margin: 0px;
	padding: 7px 0px 0px 0px;
	letter-spacing: -1px;
}

.post .title a {
	border: none;
	letter-spacing: 1px;
	text-align: left;
	text-shadow: 1px 2px 1px #FFFFFF;
	text-transform: uppercase;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 26px;
	font-weight: normal;
	color: #3A4648;
}

.post .meta {
	margin-bottom: 30px;
	padding: 0px;
	letter-spacing: 1px;
	text-align: left;
	text-shadow: 1px 2px 1px #FFFFFF;
	text-transform: uppercase;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 11px;
	font-weight: normal;
}

.post .meta .date {
	float: left;
}

.post .meta .posted {
	float: right;
}

.post .meta a {
}

.post .entry {
	padding: 0px 0px 30px 0px;
	padding-bottom: 20px;
	text-align: justify;
}

.links {
	float: right;
	margin: 20px 0px 30px 0px;
	text-align: right;
	text-shadow: 1px 2px 1px #FFFFFF;
	text-transform: uppercase;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
	font-weight: normal;
}

.more {
	display: block;
	float: left;
	padding: 0px 0px 0px 0px;
	margin-right: 30px;
}

.comments {
	display: block;
	float: left;
	padding: 0px 0px 0px 0px;
}

/* Sidebar */

#sidebar {
	float: right;
	width: 280px;
	margin: 0px;
	padding: 30px 0px 0px 0px;
}

#sidebar ul {
	margin: 0;
	padding: 0;
	list-style: none;
	letter-spacing: 1px;
	text-shadow: 1px 1px 1px #C76200;
	text-transform: uppercase;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 11px;
	font-weight: normal;
	color: #FF9900
}

#sidebar li {
	margin: 0;
	padding: 0;
}

#sidebar li ul {
	margin: 0px 0px;
	padding-bottom: 50px;
}

#sidebar li li {
	line-height: 35px;
	border-bottom: 1px dashed #FFD0A3;
	margin: 0px 30px;;
	letter-spacing: 1px;
	text-shadow: 1px 1px 1px #C76200;
	text-transform: uppercase;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 11px;
	font-weight: normal;
	color: #FFFFFF;
}

#sidebar li li span {
	display: block;
	margin-top: -20px;
	padding: 0;
	font-size: 11px;
	font-style: italic;
}

#sidebar li li a {
	padding: 0px 0px 0px 0px;
}

#sidebar h2 {
	margin: 0px;
	padding: 0px 0px 30px 0px;
	padding-left: 30px;
	letter-spacing: 1px;
	text-align: left;
	text-shadow: 1px 2px 1px #FFFFFF;
	text-transform: uppercase;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 20px;
	font-weight: normal;
	color: #3A4648;
}

#sidebar p {
	margin: 0 0px;
	padding: 0px 30px 20px 30px;
	text-align: justify;
}

#sidebar a {
	border: none;
}

#sidebar a:hover {
	text-decoration: underline;
}

/* Calendar */

#calendar {
}

#calendar_wrap {
	padding: 20px;
}

#calendar table {
	width: 100%;
}

#calendar tbody td {
	text-align: center;
}

#calendar #next {
	text-align: right;
}

/* Three Column Footer Content */

#footer-content {
	background: #FFA308 url(../images/img02.gif) repeat;
	border-top: 10px #FF4E00 solid;
	color: #FF4E00;
}

#footer-content a {
	color: #FFFFFF;
}

#footer-bg {
	overflow: hidden;
	width: 890px;
	padding: 40px 55px 30px 55px;
}

#footer-content h2 {
	margin: 0px;
	padding: 0px 0px 20px 0px;
	letter-spacing: 1px;
	text-shadow: 1px 1px 1px #C76200;
	text-transform: uppercase;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 16px;
	font-weight: normal;
	color: #FFFFFF;
}

#footer-content ul {
	margin: 0px;
	padding: 0px;
	list-style: none;
	letter-spacing: 1px;
	text-shadow: 1px 1px 1px #C76200;
	text-transform: uppercase;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 11px;
	font-weight: normal;
	color: #FFFFFF;
}

#footer-content li {
	padding: 7px 0px 8px 0px;
	border-bottom: 2px dashed #FFBFA3;
}

#footer-content p {
	letter-spacing: 1px;
	text-shadow: 1px 1px 1px #C76200;
	text-transform: uppercase;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 11px;
	font-weight: normal;
	color: #FFFFFF;
}

#column1 {
	float: left;
	width: 290px;
	margin-right: 30px;
}

#column2 {
	float: left;
	width: 280px;
}

#column3 {
	float: right;
	width: 260px;
}

/* Footer */

#footer {
	height: 50px;
	margin: 0 auto;
	padding: 0px 0 15px 0;
	font-family: Arial, Helvetica, sans-serif;
}

#footer p {
	margin: 0;
	padding-top: 30px;
	line-height: normal;
	letter-spacing: 1px;
	text-align: center;
	text-decoration: none;
	text-align: center;
	text-shadow: 1px 1px 1px #C76200;
	text-transform: uppercase;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
	font-weight: normal;
	color: #FFFFFF;
}

#footer a {
	color: #FFFFFF;
}

#marketing {
	overflow: hidden;
	margin-bottom: 30px;
	padding: 20px 0px 10px 0px;
	border-top: 1px solid #E7EBED;
	border-bottom: 1px solid #E7EBED;
}

#marketing .text1 {
	float: left;
	margin: 0px;
	padding: 0px;
	letter-spacing: -2px;
	text-transform: lowercase;
	font-size: 34px;
	color: #345E9B;
}

#marketing .text2 {
	float: right;
}

#marketing .text2 a {
	display: block;
	width: 252px;
	height: 38px;
	padding: 15px 0px 0px 0px;
	background: url(../images/img07.jpg) no-repeat left top;
	letter-spacing: -2px;
	text-align: center;
	text-transform: lowercase;
	font-size: 30px;
	color: #FFFFFF;
}


.button {
background-color: #FF9900;
color: #FFFFFF;
font-family: verdana;
font-weight: bold;
}

es que no se exactamente si lo tengo que poner un margin o un margin-left, o un padding...estoy un poco liosa

Mil gracias!

alexk · #4 (**permalink**) 08/11/2011, 04:46

aun no entiendo bien igual por estar despertando XD... pero bueno te falto el HTML... o mejor si tienes la URL del sitio funcionando

tuka_85 · #5 (**permalink**) 08/11/2011, 23:35

he hecho algun cambio pero ahora se queda abajo el Menu (inicio, sobre mi, contacto..).

http://martatorreajo.es/web2/

Cambie en el css el padding pero no se si estara bien...

pongo el html...

Código:


<!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>
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>..::Marta Torre Ajo::.. Programación de Aplicaciones y Entornos Web</title>
<link href="style.css" rel="stylesheet" type="text/css" media="screen" />
<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-22627294-2']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>
</head>
<body>
<div id="wrapper">
	<div id="header" class="container">
		<div id="logo">
 <table width="600" border="0">
  <tr>
    <th width="100" scope="col"><img src="images/logo.png" alt="" width="129" height="137" /></th>
    <th width="10"></th>
    <th width="447" scope="col"><h1>Marta Torre Ajo<br /><p>Programación de Aplicaciones y Entornos Web</p></h1></th>
  </tr>
  <tr>

</table>

 

	  </div>
		<div id="menu">
		  <ul>
		    <li class="current_page_item"><a href="index.html">Inicio</a></li>
				<li><a href="sobremi.html">Sobre mi</a></li>
				<li><a href="contacto.php">Contacto</a></li>

		  </ul>
	  </div>
	</div>
	<!-- end #header -->
	<div id="page">
		<div id="content">
			<div class="post">
				
                <br /><br />

				<div style="clear: both;">&nbsp;</div>
				<div class="entry">
					<p>Bienvenidos a la página web de Marta Torre Ajo,  especializada en
servicios de software y asesoramiento personalizado. Aquí encontrará información
relevante y de utilidad. Si necesita informacion adicional solamente tiene que ponerse en contacto conmigo en el formulario de contacto.</p>

					
				</div>
			</div>
            

<table width="592" border="0">
  <tr>
  
    <th width="188" scope="col"><strong><center>Servicios</center></strong></th>
    <th width="198" scope="col"><strong><center>Portafolio</center></strong></th>
    <th width="192" scope="col"><strong><center>Blog</center></strong></th>
    
  </tr>
  <tr>
    <td><center><a href="servicios.html"><img src="images/Globe2.png" alt="" width="128" height="128" /></a></center></td>
    <td><center><a href="portafolio.html"><img src="images/NotePad.png" alt="" width="128" height="128" /></a></center></td>
    <td><center><a href="http:\\blog.martatorreajo.es" target="_new"><img src="images/wordpress.png" alt="" width="128" height="128" /></a></center></td>
  </tr>
  <tr>
    <td><div align="left">Marta Torre Ajo les brinda una amplia gama de servicios para solucionar todas sus necesidades.</div></td>
    <td><div align="left">Este apartado es donde vereis los proyectos y trabajos que voy realizando. Espero que os guste.</div></td>
    <td><div align="left">Aquí es donde plasmo un poco todas las ideas que tengo en mi cabeza, que no son pocas.</div></td>
  </tr>
</table>

<div style="clear: both;">&nbsp;
<div class="post">
		      <div style="clear: both;">&nbsp;</div>
		      <div class="entry"></div>
      </div>
      </div>
		</div>
		<!-- end #content -->
		<div id="sidebar">
			<ul>
			  <li></li>
              
				<li><div align="right">SIGUEME EN REDES SOCIALES</div>
					
	            </li>
				
	<!-- aqui pondremos las redes sociales -->
	<table width="200" border="0" align="right">
  <tr>
    <th scope="col"><a href="https://plus.google.com/u/0/109807746424723881487/posts?hl=es" target="_new"><img src="images/google.png" alt="" width="57" height="56" /></a></th>
    <th scope="col"><a href="https://www.facebook.com/pages/martatorreajoes/114814401930156?ref=tn_tinyman" target="_new"><img src="images/facebook.png" alt="" width="57" height="56" /></a></th>
    <th scope="col"><a href="http://www.tuenti.com/#m=Page&func=index&page_key=1_2164_64331176" target="_new"><img src="images/tuenti.png" alt="" width="57" height="56" /></a></th>
    <th scope="col"><a href="https://twitter.com/#!/MartaTorreAjo" target="_new"><img src="images/twitter.png" alt="" width="57" height="56" /></a></th>
  </tr>
</table>

		
			</ul>
		</div>
		<!-- end #sidebar -->
		<div style="clear: both;">&nbsp;</div>
	</div>
	<!-- end #page -->
<div id="footer-content">
	<div id="footer-bg" class="container">
		
		
		
  </div>
<div id="footer">
	<p>Copyright (c) 2011 martatorreajo.com. Todos los derechos reservados. Desarollado por <a href="http:\\www.martatorreajo.es">Marta Torre Ajo</a>.</p>
</div>
</div>
<!-- end #footer -->
</body>
</html>

Mil gracias!

alexk · #6 (**permalink**) 09/11/2011, 03:44

mmm.... sera mejor que no uses tablas, pero bueno, yo quitaria los paddings a "#logo" y a "<table width="600" border="0">" le pondria 540px y ya supongo nose como quieres que se muestre

tuka_85 · #7 (**permalink**) 09/11/2011, 04:36

ou yeah!

Mil gracias ^^