[SOLUCIONADO] Problema con la etiqueta párrafo

aguc0d3d · #1 (**permalink**) 07/04/2013, 11:00

Bueno usuarios del Foro del Web les pido mi ayuda por que no se como centrar y que tenga una separación en los lados la etiqueta de párrafo (p) en un aside, por que le pongo la etiqueta max-width: 90%; y text-align: centrer; en el aside pero se sale el texto del párrafo (p) del aside. Gracias de ante mano.

emprear · #2 (**permalink**) 07/04/2013, 11:14

si usás valores pòrcentuales, estos refieren al ancho del elemento padre
Es decir, si tenés

Código:

<body>
<aside>
<p style="width: 90%">sss</p>
</aside>
</body>

el ancho de ese p representará el 90% del body, que por defecto es del 100%, tenés que asignar un ancho al aside.
SAludos

aguc0d3d · #3 (**permalink**) 07/04/2013, 11:17

Si pero es que ese aside ya tiene un width de 30% por que va al lado de un article con un width de 65% y que estos dos estan dentro de de un section

pitufoweb · #4 (**permalink**) 07/04/2013, 11:54

Hola,

No crees que seria mas fácil si pones el código que estas usando?

Saludos

aguc0d3d · #5 (**permalink**) 07/04/2013, 12:02

Código HTML:

Código:

<section id="content">
		<section id="main">
			<article>
				<!-- aqui hay una galería de imagenes... -->
			</article>
		</section>
		<aside>
                      <p>este es el texto que se sale de su etiqueta aside...</p>
		</aside>
	</section>

Código CSS:

Código:

section#main, aside {
	display: inline-block;
	margin: 0 auto;
	max-width: 100%;
	vertical-align: top;
	width: 65%;
}
aside {
	width: 30%;
	height: 426px;
	background: #dec800;
}

A sus ordenes, saludos

emprear · #6 (**permalink**) 07/04/2013, 12:15

Cita:

Iniciado por aguc0d3d

Código HTML:

Código:

<section id="content">
		<section id="main">
			<article>
				<!-- aqui hay una galería de imagenes... -->
			</article>
		</section>
		<aside>
                      <p>este es el texto que se sale de su etiqueta aside...</p>
		</aside>
	</section>

Código CSS:

Código:

section#main, aside {
	display: inline-block;
	margin: 0 auto;
	max-width: 100%;
	vertical-align: top;
	width: 65%;
}
aside {
	width: 30%;
	height: 426px;
	background: #dec800;
}

A sus ordenes, saludos

ahora si, porque adivinos no somos, y decime, vos no lo que querías era centrar el párrafo?

Código:

<!DOCTYPE html>
<html lang="es-ar">
<head>
<meta charset="utf-8" />
<title>Html5</title>

<style type="text/css">
/*<![CDATA[*/

section#main, aside {
	display: inline-block;
	margin: 0 auto;
	max-width: 100%;
	vertical-align: top;
	width: 65%;
}
aside {
	width: 30%;
	height: 426px;
	background: lime;
}

p{
width: 100%;
text-align: center;
}
/*]]>*/
</style>
</head>
<body>
<section id="content">
		<section id="main">
			<article>
				<!-- aqui hay una galería de imagenes... -->
			</article>
		</section>
		<aside>
                      <p>este es el texto que se sale de su etiqueta aside...</p>
		</aside>
	</section>

</body>
</html>

aguc0d3d · #7 (**permalink**) 07/04/2013, 12:41

Bueno yo lo que quiero es que el texto del párrafo no se salga del aside, agregué lo que usted me añadió pero no dió resultado, el texto se sigue saliendo del aside :(

pzin · #8 (**permalink**) 07/04/2013, 13:35

¿Y qué texto lleva ese párrafo? A ver si no va a tener espacios, entonces la solución es otra.

aguc0d3d · #9 (**permalink**) 07/04/2013, 13:46

Cita:

Iniciado por pzin

¿Y qué texto lleva ese párrafo? A ver no va a tener espacios, entonces la solución es otra.

:O me hizo gracia tu gran deducción, se sale del aside por que ese texto no tenía espacios como tu bien dijiste. Tema resuelto, ya que no creo que tenga que poner una palabra tan larga que se salga del aside.

Nuevamente gracias, saludos.

pzin · #10 (**permalink**) 07/04/2013, 13:50

Lo que puedes hacer también, es usar word-wrap:

Código CSS:

Ver originalaside p {
  word-wrap: break-word;
}

Así las palabras largas se cortarán.

emprear · #11 (**permalink**) 07/04/2013, 15:20

Cita:

Iniciado por aguc0d3d

Bueno yo lo que quiero es que el texto del párrafo no se salga del aside, agregué lo que usted me añadió pero no dió resultado, el texto se sigue saliendo del aside :(

Realmente yo no entiendo, no se si lo hacen de distraídos o nos (bueno "me" al menos), tratan de inbéciles.
Primero hay que imaginar todo un css que no se expone, luego el texto que se usa
http://foros.emprear.com/css/aside_afuera.html

manos mal que lo tenemos a @pzin

aguc0d3d · #12 (**permalink**) 08/04/2013, 02:12

Bueno como comprenderás yo no sabía que al hacer un texto sin espacios ( texto aleatorio) se saldría del aside, es por eso que no le di importancia y no lo mencioné.

En cuanto a lo del css no expuesto... te doy toda la razón, soy un novato me registré ste mismo mes..