Hola, me estoy iniciando a hacer paginas web por mi cuenta y me he dado cuenta de que es muuuy dificil. Ahora estoy construyendo una y tengo un problema que debe ser una tonteria pero es que llevo 2 dias intentando resolverlo y nada......
La verdad es que he aplicado estilos Css y en algunas paginas se me ve bien, y en otras mal.... A ver si me se explicar: la barra de navegacion, mas la"zona" mas la foto principal deberian quedar alineadas, y eso solo me pasa en una pag y en la otra no...
PAGINA EN LA QUE SE VE BIEN:
<div id="global">
<div id="cabecera">
<div id="logotipo"><img src="../objetos2/logo.png" width="518"
height="100" alt="Practicas recepcion"></a></div>
<div id="publicidad"><img src="../objetos2/flag.jpg" width="150"
height="80" alt="Practicas en Inglaterra"></a></div>
</div>
<p>
<div id="contenido">
<p>
<div id="pestanas"><ul><li><a href="../index.html">INICIO</a></li><li><a class="activa"><href="../practicas/practicas.html">PRACTICAS</a></li><li><a href="../cursos ingles/cursosingles.html">CURSOS INGLES</a></li><li><a href="../londres/londres.html">Beca MEC</a></li><li><a href="../index.html">LONDRES</a></li><li><a href="../testimonios/testimonios.html">TESTIMONIOS</a></li><li><a href="../faq/faq.html">F.A.Q</a></li><li><a href="../contacto/contacto.html">CONTACTO</a></li></ul></div>
<div id="zona">PRACTICAS / TRABAJO EN INGLATERRA</div>
</p>
<p>
<img src="objetos/catering.jpg" style="margin-left:00px" width="782px" height="280px" alt="practicas en recepcion"></p>
</p>
<div id="menu">
<h1>Título de Sección 1</h1>
<ul><li><a href="#">Enlace 1</a></li><li><a href="#">Enlace 2</a></li><li>
<a href="#">Enlace 3</a></li><li><a href="#">Enlace 4</a></li></ul>
</div>
<h1> PRACTICAS / TRABAJO EN LONDRES</h1>
<p>Lorem ipsum dolor sit amet.</p>
<p>Lorem ipsum dolor sit amet.</p>
<p>Lorem ipsum dolor sit amet.</p>
<h2>Y este es el tercer párrafo.</h2>
PAGINA QUE SE VE MAL:
<body>
<div id="global">
<div id="cabecera">
<div id="logotipo"><img src="objetos2/logo.png" width="518"
height="100" alt="Practicas recepcion"></a></div>
<div id="publicidad"><img src="objetos2/flag.jpg" width="150"
height="80" alt="Practicas en Inglaterra"></a></div>
</div>
<div id="contenido">
<div id="pestanas"><ul><li><a class="activa"><href="../index.html">INICIO</a></li><li><a href="../practicas/practicas.html">PRACTICAS</a></li><li><a href="../cursos ingles/cursosingles.html">CURSOS INGLES</a></li><li><a href="../londres/londres.html">Beca MEC</a></li><li><a href="../testimonios/testimonios.html">TESTIMONIOS</a></li><li><a href="../faq/faq.html">F.A.Q</a></li><li><a href="../contacto/contacto.html">CONTACTO</a></li></ul></div>
<div id="zona">INICIO</div>
<div id="fotoprincipal">
<img src="objetos2/recepcion.png" width="785px" height="280px" alt="practicas en recepcion">
</div>
<p>
<img src="objetos2/fondo.jpg" style="float:left"><h1>Gesline Practicas </h1></p>
<p>Lorem ipsum dolor sit amet.</p>
<p>Lorem ipsum dolor sit amet.</p>
<p>Lorem ipsum dolor sit amet.</p>
<h2>Y este es el tercer párrafo.</h2>
<p>xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxx
xxxxxxx
x
x
x
x
xx
xxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxx</p>
</div>
<div id="pie">
<div id="pieuno">
<ul><li><a href="#">Gesine Editores</a></li><li><a href="#">Nosotros</a></li><li><a href="#">Inicio</a></li></ul></div>
<div id="piedos">Gesline Practicas Hosteleria y Turismo</div>
<div id="pietres"><ul><li><a href="#">Inicio</a></li><li><a href="#">Contacto</a></li><li><a href="#">Mapa Web</a></li></ul>
</div>
</div>
</body>
HOJA DE ESTILOS
* {margin:0px ; padding:0px ; border: 0px; font: calibri}
#global {width:800px ; margin:auto }
* {text-indent:0px ; margin:0px ; padding:0px ; border:0px}
.imagen{margin:0 auto 0 auto}
p {text-align: justify ; font-family: calibri; color: grey}
h1 {font-size: 1.3em; color:#ff6600 ; font-weight: bold ; text-decoration: none ;
text-align: center ; font-family: a love of thunder; padding: 12px}
h2 {font.size: 1.1em; color: #ff6600 ; font-weight: bold ; text-decoration: none ;
text-align: center ; font-family: calibri}
body {text-align: center ; background-image: url(objetos2/background.jpg)}
#cabecera {border-top: silver 2px solid ;border-left: silver 2px solid;border-right: silver 2px solid; height:90px ; width: 800px}
#logotipo {width:516px ; float:left ; padding-left: 8px }
#publicidad {width:200px ; float:right ; padding-top:8px; padding-right:8px ;filter: alpha(opacity=30) }
#contenido {background-color:white; width: 800px; border-left: silver 2px solid;border-right: silver 2px solid}
#contenido p {padding-top:0px ; padding-right:0px ; padding-bottom:0px ; padding-top: 0px ; padding-left:6px ; margin:0px 0px 0px 0px }
#pestanas { width:780px; font-size: 10px;font-weight: bold; background-color: black}
#pestanas li {float:left;margin:0px 8px 0px 8px; padding:0; font-family:calibri; font-size: 1.4em}
#pestanas ul {list-style:none }
#pestanas a {padding:0px 8px 0px 12px; color: white;text-decoration:none}
#pestanas a:link {}
#pestanas a:visited {}
#pestanas a:hover {color:white ; text-decoration:bold ; display:block }
#pestanas a.activa {background-color:#ff6600; display: block}
#zona {padding: 0px; background-color: #ff6600; width:780px ; font-family:a love of thunder; text-align: right; padding-right :10px ; font-size: 20px }
#fotoprincipal { style: margin-left:00px; width:783px ; height:280px}
#menu {width: 150px ; float:left ;
text-align:left ; margin: 3px 10px 3px 10px ;
background-color: black;
padding-bottom:5px }
#menu li {list-style:none ; margin: 0px 0px 0px 0px ; font-family: calibri }
#menu a {color: white; text-decoration:none}
#menu a:link {}
#menu a:visited {}
#menu a:hover {color:white ; text-decoration:bold ; display:block }
#menu a.activa {background-color:#ff6600; display: block}
#pie {border: silver 2px solid ; width: 800px ; height: 70px; background-color: white}
#pieuno { float:left ; padding-right: 165px; padding-left: 40px }
#piedos { font-family: calibri; color: grey ; float:left}
#pietres { float : left; padding-left: 165px ; padding-right:40px }
#pie li {list-style:none ; font-size:12px }
#pie a {font-family: calibri; color: grey; text-decoration:none}
#pie a:link {}
#pie a:visited {}
#pie a:hover {color:black ; text-decoration:bold }
#pie a:active {color:black}
No se que hago mal... al igual hay errores pk me estoy volviendo loca intentando mil cosas... espero haberme explicado bien con el poco vocabulario tecnico que tengo hasta el momento..
Muchas gracias.