Foros del Web » Creando para Internet » CSS »

Trivia: Conceptos CSS

Estas en el tema de Trivia: Conceptos CSS en el foro de CSS en Foros del Web. Es que logre separarlos en 3 columnas pero con un margen entre ellas amplio y pues entre lineas si le quedaban como 5 px.. seguire ...

  #121 (permalink)  
Antiguo 23/07/2008, 09:01
Avatar de messer  
Fecha de Ingreso: julio-2004
Mensajes: 467
Antigüedad: 13 años, 4 meses
Puntos: 5
Respuesta: Trivia: Conceptos CSS

Es que logre separarlos en 3 columnas pero con un margen entre ellas amplio y pues entre lineas si le quedaban como 5 px.. seguire intentando
__________________
<script type="text/messerScript"><!--
window.onload=function(){ loadMesserRules(this.href) }
--></script>
  #122 (permalink)  
Antiguo 23/07/2008, 09:12
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: Trivia: Conceptos CSS

No te compliques messer,
Lo de la separación entre columnas podía a ver sido otro número por decir algo. 50px por ejemplo. Quiero ver soluciones!

Postea tu solución a ver

PD: Antes que nada pedir disculpas, pues se me olvidaron colocar elementos p
Ahora lo he probado y si funciona. Sry , ya esta editado
  #123 (permalink)  
Antiguo 23/07/2008, 09:17
Avatar de PedroRodas  
Fecha de Ingreso: noviembre-2005
Ubicación: Cádiz
Mensajes: 393
Antigüedad: 12 años
Puntos: 0
Respuesta: Trivia: Conceptos CSS

div p{float:left; width:30%}?????
__________________
Genial concierto de Roger Waters, Pink Floyd siguen vivos!!!
  #124 (permalink)  
Antiguo 23/07/2008, 09:21
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Respuesta: Trivia: Conceptos CSS

Cita:
Iniciado por Nathan_1979 Ver Mensaje
Código PHP:
<div id="prueba"><p>Lorem ipsum dolor sit ametconsectetuer adipiscing elit. </p>
<
p>Donec id semIn hac habitasse platea dictumstQuisque a semSed id felisNam quam orci
dictum sedsuscipit mollisimperdiet ineratUt accumsan libero sit amet estMauris  ligula.</p>
<
pDonec elit ipsumconvallis quiselementum portaluctus velnisiPraesent 
nec magna
Etiam non maurisVestibulum vitae nibh ut est fringilla luctusQuisque ut
 leo
Integer sed anteAenean sapien felisaliquet iddapibus utfaucibus utmagna.</p>
 <
p>Praesent justo eroslobortis etmalesuada atvarius velurnaDonec 
ullamcorper
Sed libero semcommodo aeuismod acursus fermentumsapienCras
 fringilla
.</p>
</
div

Que 2 propiedades usaríais para colocar este texto a 3 columnas y con una separación de 5 px.

#prueba p{width:30%;float:left;margin:0 5px;}
  #125 (permalink)  
Antiguo 23/07/2008, 09:26
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: Trivia: Conceptos CSS

Jeje la cosa es más sencilla Pedro,
y solo con 2 propiedades DragonX

Genial mas soluciones!!

Os rendís??
  #126 (permalink)  
Antiguo 23/07/2008, 09:29
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Respuesta: Trivia: Conceptos CSS

solo con dos propiedades????...........ta difícil
  #127 (permalink)  
Antiguo 23/07/2008, 09:35
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Trivia: Conceptos CSS

#prueba p{width:30%; white-space:pre-line;}

¿?
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #128 (permalink)  
Antiguo 23/07/2008, 09:37
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: Trivia: Conceptos CSS

Cita:
Iniciado por DragonX Ver Mensaje
solo con dos propiedades????...........ta difícil
me empieza a gustar esto de preguntar
  #129 (permalink)  
Antiguo 23/07/2008, 09:43
Avatar de PedroRodas  
Fecha de Ingreso: noviembre-2005
Ubicación: Cádiz
Mensajes: 393
Antigüedad: 12 años
Puntos: 0
Respuesta: Trivia: Conceptos CSS

pero si adema acabo de darme cuenta de que son 4 parrafos, quillo dilo ya que me toi queando pillao
__________________
Genial concierto de Roger Waters, Pink Floyd siguen vivos!!!
  #130 (permalink)  
Antiguo 23/07/2008, 09:48
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Respuesta: Trivia: Conceptos CSS

kseso? creo que es pre-wrap y no pre-line

a ver.....y si no me rindo!

#prueba p{width:30%; white-space:pre-wrap;}
  #131 (permalink)  
Antiguo 23/07/2008, 09:48
Avatar de Raulmmmm  
Fecha de Ingreso: marzo-2007
Ubicación: En otro lugar que tú
Mensajes: 1.549
Antigüedad: 10 años, 8 meses
Puntos: 36
Respuesta: Trivia: Conceptos CSS

Es que hay 4 p... y son 3 columnas... ¿Es un error o es que hay que hacerlo con 4 p?

Si no es un error... esta es la solución:
Código:
#prueba p{ display: table-cell; margin: 0 5px; }
A ver si se me ocurre alguna pregunta (si acierto).
  #132 (permalink)  
Antiguo 23/07/2008, 09:51
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Respuesta: Trivia: Conceptos CSS

Raulmmmm excelente!!!!! anda perfectamente!
  #133 (permalink)  
Antiguo 23/07/2008, 09:53
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: Trivia: Conceptos CSS

Yo lo tengo funcionando asi:

1 Columna:
2 parrafos.


2Columna:
1 parrafo


3Columna:
1 parrafo


Con una separación de 50px por poner algo.
  #134 (permalink)  
Antiguo 23/07/2008, 09:55
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: Trivia: Conceptos CSS

Eyyy raulmmmm pero tienes 4 columnas ! Oops!

Yo pensaba de otra forma pero como sois unos gurus... :D

Código PHP:
#prueba {
    
-moz-column-count:3;
    -
moz-column-gap:5px;

http://www.w3.org/TR/css3-multicol/#the-multi-column
Sencillo no?
  #135 (permalink)  
Antiguo 23/07/2008, 09:59
Avatar de Raulmmmm  
Fecha de Ingreso: marzo-2007
Ubicación: En otro lugar que tú
Mensajes: 1.549
Antigüedad: 10 años, 8 meses
Puntos: 36
Respuesta: Trivia: Conceptos CSS

Nathan no conocía esas propiedades... son de CSS3, ¿no?.

Bueno, allá va mi pregunta:
¿Con qué propiedad se quita el borde de puntitos que sale cuando pinchas en un enlace?
  #136 (permalink)  
Antiguo 23/07/2008, 10:00
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Trivia: Conceptos CSS

Cita:
Iniciado por DragonX Ver Mensaje
kseso? creo que es pre-wrap y no pre-line

a ver.....y si no me rindo!

#prueba p{width:30%; white-space:pre-wrap;}
pre-wrap: se respetan los espacios en blanco y las nuevas líneas, pero ajustando
cada línea al espacio asignado para ese contenido.
pre-line: elimina los espacios en blanco y respeta las nuevas líneas, pero ajustando cada línea al espacio asignado para ese contenido.
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #137 (permalink)  
Antiguo 23/07/2008, 10:01
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Respuesta: Trivia: Conceptos CSS

outline:none;

  #138 (permalink)  
Antiguo 23/07/2008, 10:03
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Respuesta: Trivia: Conceptos CSS

Cita:
Iniciado por kseso? Ver Mensaje
pre-wrap: se respetan los espacios en blanco y las nuevas líneas, pero ajustando
cada línea al espacio asignado para ese contenido.
pre-line: elimina los espacios en blanco y respeta las nuevas líneas, pero ajustando cada línea al espacio asignado para ese contenido.
Gracias!
  #139 (permalink)  
Antiguo 23/07/2008, 10:04
Avatar de messer  
Fecha de Ingreso: julio-2004
Mensajes: 467
Antigüedad: 13 años, 4 meses
Puntos: 5
Respuesta: Trivia: Conceptos CSS

Pues no es por echar a perder la cuestion pero hay 4 columnas en el codigo de Raulmmmm me da un resultado parecido si coloco: width:200px; float:left;

Oooops!! como que escribi tarde.
__________________
<script type="text/messerScript"><!--
window.onload=function(){ loadMesserRules(this.href) }
--></script>
  #140 (permalink)  
Antiguo 23/07/2008, 10:06
Avatar de Raulmmmm  
Fecha de Ingreso: marzo-2007
Ubicación: En otro lugar que tú
Mensajes: 1.549
Antigüedad: 10 años, 8 meses
Puntos: 36
Respuesta: Trivia: Conceptos CSS

Correcto DragonX . La próxima será más difícil.
  #141 (permalink)  
Antiguo 23/07/2008, 10:18
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: Trivia: Conceptos CSS

Cita:
Iniciado por Raulmmmm Ver Mensaje
Nathan no conocía esas propiedades... son de CSS3, ¿no?.

, estoy ahora viendo cosas sobre CSS3 para que no pille cuando venga jejeje
  #142 (permalink)  
Antiguo 23/07/2008, 10:19
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: Trivia: Conceptos CSS

Cierto messer, ya lo dije en un post mas arriba.

Pero me precipite al dar mi solución.
  #143 (permalink)  
Antiguo 23/07/2008, 10:54
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Trivia: Conceptos CSS

# {visibility: hidden;}
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #144 (permalink)  
Antiguo 23/07/2008, 10:59
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: Trivia: Conceptos CSS

{
border:1px solid #000;
}

Lo veis?

  #145 (permalink)  
Antiguo 23/07/2008, 11:01
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: Trivia: Conceptos CSS

Quería hacer una puntualización con respecto a la pregunta de Nathan_1979:

cuando dije que ni siquiera era capaz de imaginar una solución era cierto, porque en ese momento no había párrafos en el div que puso, y por eso no imaginaba cómo demonios iba a romper las columnas.

Ahora al ver las soluciones propuestas que hablan de párrafos, miro otra vez y aparecen por arte de magia unas <p>.

La verdad es que me estaba haciendo la cabeza chirivitas con cómo harías las columnas sin párrafos, sólo un bloque de texto.

Y ya de paso, me he perdido. ¿De quién es el turno?

Mikel.
  #146 (permalink)  
Antiguo 23/07/2008, 11:06
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Trivia: Conceptos CSS

Hola Mikel
le toca a
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #147 (permalink)  
Antiguo 23/07/2008, 11:23
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: Trivia: Conceptos CSS

Mikmoro:

Cita:
Iniciado por Nathan_1979 Ver Mensaje
PD: Antes que nada pedir disculpas, pues se me olvidaron colocar elementos p
Ahora lo he probado y si funciona. Sry , ya esta editado
  #148 (permalink)  
Antiguo 23/07/2008, 11:29
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: Trivia: Conceptos CSS

Es que como verás mi respuesta es de esta mañana (para mi), a las 10,34, y la edición a las 4 de la tarde. Por eso me he conetado hace un ratillo y estaba flipando con las respuestas.

Pues me has hecho alucinar un buen rato.

Mikel.
  #149 (permalink)  
Antiguo 23/07/2008, 11:34
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Respuesta: Trivia: Conceptos CSS

¿cuál de estos es erroneo?

Cita:
a) - display:hidden;
b) - display:none;
c) - display:visible;
d) - display:illine;
e) - todas
f) - ninguna de las anteriores
  #150 (permalink)  
Antiguo 23/07/2008, 11:37
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: Trivia: Conceptos CSS

d) Seria--> display:inline;
c) Seria --> visibility: visilbe;

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

SíEste tema le ha gustado a 7 personas




La zona horaria es GMT -6. Ahora son las 11:25.