Foros del Web » Creando para Internet » CSS »

Sobre posicionamientos

Estas en el tema de Sobre posicionamientos en el foro de CSS en Foros del Web. Código: <!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> <style type="text/css"> <!-- div#izquierda { left: 5px; top: 62px; } div#medio { text-align: ...
  #1 (permalink)  
Antiguo 13/01/2009, 04:22
 
Fecha de Ingreso: enero-2008
Mensajes: 64
Antigüedad: 9 años, 10 meses
Puntos: 0
Sobre posicionamientos

Código:
<!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>
<style type="text/css">
<!--

div#izquierda {
     left: 5px;
     top: 62px;
}

div#medio {
     text-align: center;
     font-size: 25px;
     top: 25px;
}

div#medio-sub {
     text-align: center;
    
}

div#derecha {
     right: 5px;
     top: 62px;
}

-->
</style>
</head>
<body>
<p><div id="medio"><strong>Medio medio medio medio medio</strong></div>
<p><div id="izquierda">Izquierda</div><div id="medio-sub">Frase de debajo</div><div 

id="derecha">Derecha</div></p>

</body>
</html>
No se que problema debería haber en que se mostrase así:

...........................................Medio medio medio medio medio......................................
Izquierda......................................Fra se de debajo.........................................Der echa

(sin los puntos, claro está jejeje)

Sin embargo se muestra así:

En funcionamiento

Saludos.

Última edición por WildFroVII; 13/01/2009 a las 08:27
  #2 (permalink)  
Antiguo 13/01/2009, 04:41
Avatar de Aresillo
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: Becerril de la Sierra
Mensajes: 958
Antigüedad: 9 años, 8 meses
Puntos: 53
Respuesta: Sobre posicionamientos

no se porque me sale la caja de hotmail cuando le doy al link...

Ares
__________________
Las dudas son el alimento de la inteligencia. A. Einstein
Everything we are is the end result of our thoughts. Sidhartta Gautama
  #3 (permalink)  
Antiguo 13/01/2009, 08:28
 
Fecha de Ingreso: enero-2008
Mensajes: 64
Antigüedad: 9 años, 10 meses
Puntos: 0
Respuesta: Sobre posicionamientos

Editado el primer post, ya se debería ver.
  #4 (permalink)  
Antiguo 13/01/2009, 08:38
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: Sobre posicionamientos

El problema es que los
Código HTML:
div
Son elementos de bloque!

Saludos!

Pd: los elementos de bloque son por los que por naturaleza hacen un salto de linea.

Última edición por Nathan_1979; 13/01/2009 a las 08:44
  #5 (permalink)  
Antiguo 13/01/2009, 10:05
 
Fecha de Ingreso: enero-2008
Mensajes: 64
Antigüedad: 9 años, 10 meses
Puntos: 0
Respuesta: Sobre posicionamientos

¿Cómo hago entonces? Porque este....

Código:
<html>

<head>

<style type="text/css">
<!--
.izquierda {
	text-align: left;
}
.medio {
	text-align: center;
}
.derecha {
	text-align: right;
}
-->
</style></head>

<body>

<p><span class="izquierda">Izquierda,</span> <span class="medio">medio,</span> <span class="derecha">derecha.</span></p>

</html>
Tampoco sirve.

Un saludo.
  #6 (permalink)  
Antiguo 13/01/2009, 10:25
 
Fecha de Ingreso: enero-2008
Mensajes: 64
Antigüedad: 9 años, 10 meses
Puntos: 0
Respuesta: Sobre posicionamientos

Código:
<!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>
<style type="text/css">
<!--

div#izquierda {
     position: absolute;
     left: 5px;
     top: 64px;
}

div#medio {
     text-align: center;
     font-size: 25px;
     top: 25px;
}

div#medio-sub {
     text-align: center;
     font-size: 18px;
    
}

div#derecha {
     position: absolute;
     right: 5px;
     top: 64px;
}

-->
</style>
</head>
<body>
<p><div id="medio"><strong>Web-to-cutre.com</strong></div>
<p><div id="izquierda">Izquierda</div><div id="medio-sub">Que ni es com ni es nada 

pero le pongo esto por algún motivo</div><div id="derecha">Derecha</div></p>

</body>
</html>
¡Conseguido!

¿Alguna solución menos chapucera? Un saludo.
  #7 (permalink)  
Antiguo 13/01/2009, 10:54
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: Sobre posicionamientos

Sip, enviado...
  #8 (permalink)  
Antiguo 13/01/2009, 10:57
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: Sobre posicionamientos

Hay mil y una forma de hacerlo.
Esta es una ;)

Código HTML:
<div id="cabecera">
	<h1>Web-to-cutre.com</h1>
</div>

<div id="main">
    <div id="izquierda">
        <p>Izquierda</p>
    </div>
    
    <div id="medio">
        <p>Que ni es com ni es nada pero le pongo esto por algún motivo</p>
    </div>
    
    
    <div id="derecha">
        <p>Derecha</p>
    </div>
</div> 


Código:
* { margin:0; padding:0;}

#cabecera h1 {
	text-align:center;
}

#main {
	overflow:hidden;
	width:80%;
	margin:0 auto;
}
	#izquierda {
		float:left;
		width:30%;
		border:1px solid #0066FF;
	}
	#medio{	
		float:left;
		width:35%;
		border:1px solid #9933FF;
	}
	#derecha { 
		float:left;
		width:30%;
		text-align:right;
		border:1px solid #99FFCC;
	
	}


PD: Solo un apunte, los parrafos no pueden contener otros elementos de bloque ( como por ejemplo 'div' ), por lo que meter div dentro de etiquetas 'p' es un error grave.
  #9 (permalink)  
Antiguo 13/01/2009, 13:50
 
Fecha de Ingreso: enero-2008
Mensajes: 64
Antigüedad: 9 años, 10 meses
Puntos: 0
Respuesta: Sobre posicionamientos

Aun no se mucho de CSS porque empecé hace 2 días pero ese código que has dejado más que hacer lo que digo, lo simula, y peor que el que yo puse.
Tu código

Aparentemente lo consigue pero realmente no pone las izuqierdas y las derechas al borde de la izquierda y la derecha respectivamente.

La verdad es que no entiendo la mitad de lo que has escrito pero ahí te dejo el link para que compruebes que es cierto. ¿Alguna alternativa más?
  #10 (permalink)  
Antiguo 13/01/2009, 14:04
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: Sobre posicionamientos

Jaja lo simula....

El código se ve perfectamente y se lo que hace,
ya que lo probé en Firefox y Ie cuando lo hice.



Cierto, se nota que has empezado hace 2 días, empieza mejor por aprender html...
que meter una capa dentro de un parrafo tiene tela.

Saludos.
__________________
Debian Squeeze rules!
  #11 (permalink)  
Antiguo 13/01/2009, 14:29
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: Sobre posicionamientos

Un chaval con 2 dedos de frente sabria cambiar 2 valores para que:

Cómo fue eso?:
izuqierdas y las derechas al borde de la izquierda y la derecha respectivamente

JAJAJAJA
__________________
Debian Squeeze rules!
  #12 (permalink)  
Antiguo 13/01/2009, 15:05
 
Fecha de Ingreso: enero-2008
Mensajes: 64
Antigüedad: 9 años, 10 meses
Puntos: 0
Respuesta: Sobre posicionamientos

Cita:
Cierto, se nota que has empezado hace 2 días, empieza mejor por aprender html...
que meter una capa dentro de un parrafo tiene tela.
Código:
<html>
<head>
<body>
<p align="center"><font size="18"><b>Web-to-cutre.com</b></font></p>
<p align="center"><a href="www.w.www">Izquierda</a> &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp Que ni es com ni es nada pero le 
pongo esto por algún motivo 
&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <a href="www.w.www">Derecha</a></p>
</body>
</html>
Ya se html y el problema que expongo es precismaente porque html no me deja hacer lo que pido.
Link

No es por nada pero deberías aprender a deducir mejor antes de nada....x-D, porque porque has dado conmig pero das con otro y con consejos así lo único que puedes conseguir es confuncidrle más todavía x-D. Repito, no es por que me pique, aunque un poco si, pero te lo puedes tomar perfectamente como consejo jeje.

Saludos. Si alguien sabe como hacer lo que pido desde el primer post que lo diga.

Saludos.

Última edición por WildFroVII; 13/01/2009 a las 15:16
  #13 (permalink)  
Antiguo 13/01/2009, 15:53
Avatar de poison_mayer  
Fecha de Ingreso: julio-2008
Mensajes: 69
Antigüedad: 9 años, 4 meses
Puntos: 2
Respuesta: Sobre posicionamientos

Intenta usar esto
<html>
<head>
<style type="text/css">
html,body{margin:0;padding:0}
body{}
div#header {text-align:center}
div#wrapper{float:left;width:100%}
div#content{margin:0 150px 0 150px; position:absolute}
div#navigation{float:left; width:150px;background:#B9CAFF}
div#right{float:right;width:150px; background:#FF8539}
</style>
</head>
<body>
<div id="container">
<div id="header"><p>Header</p></div>
<div id="wrapper">
<div id="content">
<p>contenido </p>
</div>
<div id="navigation">
<p>left</p>
</div>
<div id="right">
<p>right</p>
</div>
</div>
</div>
</body>
</html>
__________________
longtemps je me suis couché de bonne heure
  #14 (permalink)  
Antiguo 13/01/2009, 16:16
 
Fecha de Ingreso: enero-2008
Mensajes: 64
Antigüedad: 9 años, 10 meses
Puntos: 0
Respuesta: Sobre posicionamientos

Muy currado el código aunque para ser sincero no entiendo casi nada, relamente me queda mucho por aprender todavía de este lenguaje, pues ni las explicaciones las puedo comprender, en cualquier caso, muchas gracias a los dos, en unos días me pasaré por aquí otra vez a leer todo porque lo que no se puede es estar así. Un saludo.
  #15 (permalink)  
Antiguo 13/01/2009, 17:14
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Sobre posicionamientos

WildFroVII:

Seguro que te sirve este enlace.

Si eres novato en CSS, leete este libro para empezar, te lo puedes descargar gratis o leerlo online.

Saludos.

  #16 (permalink)  
Antiguo 13/01/2009, 17:19
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Sobre posicionamientos

Cita:
Iniciado por Nathan_1979 Ver Mensaje
PD: Solo un apunte, los parrafos no pueden contener otros elementos de bloque ( como por ejemplo 'div' ), por lo que meter div dentro de etiquetas 'p' es un error grave.
¿Error en qué sentido? ¿no es válido? ¿semántico?
Explícate un poco.
__________________
Visita mi nueva web idplus.org
  #17 (permalink)  
Antiguo 13/01/2009, 18:25
 
Fecha de Ingreso: enero-2008
Mensajes: 64
Antigüedad: 9 años, 10 meses
Puntos: 0
Respuesta: Sobre posicionamientos

Joer, esto tiene más de lo que pensaba, no se si me atreveré con tanto. Yo te dejo uno que debe ser del mismo autor porque la portada y el índice son iguales, sólo que para principiantes, pero para principiantes de verdad, ese que me has pasado debe ser para presos en un refugio nuclear postapocalyptico. x-DDDDDDD

Aquí le tienes - Curso Css - Introdución al Css

Saludos y hasta otra.

Cita:
Iniciado por Mikmoro Ver Mensaje
¿Error en qué sentido? ¿no es válido? ¿semántico?
Explícate un poco.
Llevaba un rato dándole vueltas, ¿no estaba div precisamente para agrupar varias etiquetas bajo los mismos efectos? De todas formas creo que lo que dice Nathan_1979 no se lo ha inventado del todo, me suena haberlo leido, pero error error no es, es lo que se llama "ilegalización" y, si entendí bien, se refiere a que en cualquier momento nos las quitan de los navegadores sustituidas por el Css, como fue pasando con html 1, 2, 3 y pasará con el 4 en unos años. ¿me equivoco?

La verdad es que aprenderse un lenguaje de estos o lo que sea profundizando hasta el final tiene más tela de la que cualquier mortal puede imaginar, ahí tengo un amiguete que se puso a hacer un curso de Word de una cnatidad de horas que te le decía y podías pensar que se estaba burlando de ti x-D, pero el tío acabó, tuvo la suerte de que le llamaran para dar clases y ahí sigue después de 4 ó 5 años, si no son más. Word x-DDDDD.

Haste luego.

Última edición por WildFroVII; 13/01/2009 a las 18:52
  #18 (permalink)  
Antiguo 14/01/2009, 01:16
Avatar de jeybi  
Fecha de Ingreso: julio-2008
Ubicación: Mexico
Mensajes: 130
Antigüedad: 9 años, 4 meses
Puntos: 10
Respuesta: Sobre posicionamientos

Lo correcto en este caso es usar <span> en ves de <div>. La diferencia de div y span es que div es un elemento de bloque y span es un elemento en linea. Div suele usarse para agrupar elementos en una pagina, y span funciona como remplazo de etiquetas <b>,<i>, etc, su funcion es de agrupar texto o lineas de texto.

Ademas si usas un <div> dentro de un <p> se genera un salto de linea porque <div> es un elemento de bloque.
  #19 (permalink)  
Antiguo 14/01/2009, 01:57
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: Sobre posicionamientos

Cita:
Iniciado por Mikmoro Ver Mensaje
¿Error en qué sentido? ¿no es válido? ¿semántico?
Explícate un poco.
Lo que dice la W3C:
Cita:
The P element represents a paragraph. It cannot contain block-level elements (including P itself).

Supongo que será un error semántico, pero vamos que el tipo de error me da lo mismo.

Para más info:
http://www.w3.org/TR/html401/struct/text.html#h-9.3.1



__________________
Debian Squeeze rules!
  #20 (permalink)  
Antiguo 14/01/2009, 02:04
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: Sobre posicionamientos

Cita:
Iniciado por WildFroVII Ver Mensaje
Joer, esto tiene más de lo que pensaba, no se si me atreveré con tanto.
La verdad es que aprenderse un lenguaje de estos o lo que sea profundizando hasta el final tiene más tela de la que cualquier mortal puede imaginar
Para que luego vengas a criticar un código (que aquí no nos pagan por ayudar a los demás) que no entiendes la mitad y que.... con todo el gusto del múndo intentamos solucionar los posibles problemas que pueda tener los que empiezan con CSS.

Me explico no?

Un saludo.
__________________
Debian Squeeze rules!
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 22:46.