Mostrar votos en comentario

OsSk4R · #1 (**permalink**) 26/05/2009, 13:09

Buenas de nuevo,
Como siempre... apenas se de css, practicamente nada y me cuesta hacer lo que quiero obviamente, asi que una vez más estoy pidiendo un poco de ayuda

Estoy creando un sistema de comentarios y quiero añadir la opcion de votar el comentario y a su vez que se muestra la puntuación del mismo.

Ésto es lo que tengo y de primeras se verá el problema:

Como veís, en el hipotetico caso de que un comentario tuviera miles y miles de votos se me descuadra y se me va hacia la derecha

Me gustaría que en el caso de ser muchos, como en la imagen, el cuadro fuera para la izquiera, asi no se descuadraría...

Él recuadro de los votos es este;

Cita:

.votos{
width:50px auto;
overflow:auto;
height:10;
left: 843px;
margin-top:-19px;
position:absolute;
background-color:#ffffff;
border: 1px solid #cfdbe3;
}

Muchas gracias

willyfc · #2 (**permalink**) 26/05/2009, 13:23

primero que nada, esto no existe:

Código:

width:50px auto;

solo lleva un valor. Ahora podrías probarlo de esta maner:

Código html:

Ver original<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<style type="text/css">
.contenedor{ background:#F7FBFF; border:1px solid #CCC; width:500px; height:auto; overflow:auto; position:relative; padding:5px;}
.votos{
width:100%;
height:15px;
text-align:center;
position:absolute;
text-align:right;
right:5%;
top:15%;
}
.votos span{padding:4px;background-color:#ffffff;border: 1px solid #cfdbe3;}
</style>
</head>
 
<body>
<div class="contenedor">
<div class="votos">
    <span>1023658</span>
</div>
<p>aquí va algo</p>
<textarea rows="3" cols="55"></textarea><br />
<input type="button" value="Enviar" />
</div>
</body>
</html>

avisas si te sirve.

hades87 · #3 (**permalink**) 26/05/2009, 13:35

Además creo que si le pones una position abosulte te ocupará siempre el mismo lugar, mientras que si lo pusieras relative sería mas fluido

willyfc · #4 (**permalink**) 26/05/2009, 13:48

Cita:

Iniciado por hades87

Además creo que si le pones una position abosulte te ocupará siempre el mismo lugar, mientras que si lo pusieras relative sería mas fluido

Pienso que tienes razón, y de paso al ser relative cuando utilicen un navegador que permite modificar la dimensión de un textarea se mantendrá en su lugar y no se moverá según el textarea vaya cambiando la dimensión del div.

Código:

.votos{
width:100%;
height:15px;
text-align:center;
position:relative;
text-align:right;
right:1%;
top:5%;
}

hades87 · #5 (**permalink**) 26/05/2009, 13:49

Claro y además le podrá poner un margin, que por ejemplo siempre este a 10px del borde, con lo que no se saldrá afuera

kseso? · #6 (**permalink**) 26/05/2009, 13:50

¿Y qué tal si simplificamos?

Código css:

Ver original.votos {
background-color:#FFFFFF;
border:1px solid #CFDBE3;
float:right;
margin:10px 35px 0 0;
padding:4px;
}

Le he asignado el margen para alinearlo con el borde derecho del textarea
y en el html suprime el span.
Posible efecto, que lo que dices "aquí va algo" crezca lo suficiente y empuje para abajo el textarea separando el contador.

Un saludo

willyfc · #7 (**permalink**) 26/05/2009, 13:58

pero en realidad nunca lo empujará ya que la cadena impresa en ese div o span siempre será una sola línea(pienso yo) sin espacios entre cada número entonces de la forma que lo propongo al tener el contenedro overflow:auto aparecerá el scroll horizontal por que hay demasiado números en ese span y de la forma que lo plantes los números que van al principio desaparecerán, o irán desapareciendo, obviamente en el caso hipotético de que alguna vez lleguen a ser tantos números.

kseso? · #8 (**permalink**) 26/05/2009, 14:35

Willy, el posible efecto de desplazamiento es sobre mi variación

Ejecuta tu código en el navegador ampliando el contador unos cuanto dígitos y al <p>aquí va algo</p> métele más texto (varias líneas)

Después haz los cambios de css a ".votos" suprimiendo el "span" que comentaba yo.

¿Notas la diferencia?

Y ya que estamos jugando con códigos, pon un fondo a tu ".votos" diferente al fondo del span. Sólo por jugar

Bueno, te pongo una captura de los dos:

Un saludo

willyfc · #9 (**permalink**) 26/05/2009, 15:11

Efectivamente Elías, no enfoque el problema de esa manera ya que me enfoque en el problema de esa cajita y no tomé en cuenta que tipo de texto iría del otro lado.

PD: El sistema no me dejó darte karma.

Consejo:Ayuda cuando tengas tiempo no cuando un cliente quiere su foro funcionando para ayer

kseso? · #10 (**permalink**) 26/05/2009, 15:20

Cita:

Iniciado por willyfc

PD: El sistema no me dejó darte karma.

Consejo:Ayuda cuando tengas tiempo no cuando un cliente quiere su foro funcionando para ayer

Por una vez soy pro-sistema

Y sobre el resto, nah, según tenga el momento y la neurona

willyfc · #11 (**permalink**) 26/05/2009, 15:24

pero mi problema esta en que debí haber terminado el foro hace 2 días

kseso? · #12 (**permalink**) 26/05/2009, 15:37

Cita:

Iniciado por willyfc

pero mi problema esta en que debí haber terminado el foro hace 2 días

Disculpa, creo que no he pillado el significado. O mejor dicho, ahora estoy perdido. No he comprendido bien a qué te referías.

willyfc · #13 (**permalink**) 26/05/2009, 15:42

lo que pasa es que lo del consejo en el post que te doy la razón era para mí por eso lo puse de ese color, es que tengo mucho trabajo y por motivos de fuerza mayor no he podido terminar y me pasan cosas tan obvias como la que paso en este problema, luego de tu post me dije:

Cita:

y yo por que no pensé en el texto que va del otro lado de la cajita

ahora sí me entiendes, el consejo me lo di yo mismo, sorry por la confusión

.

OsSk4R · #14 (**permalink**) 28/05/2009, 11:13

Bueno, no me esperaba ver tantos mensajes o.O

Y decir que una vez más gracias, ya esta solucionado :)

Nos seguimos viendo