Foros del Web » Creando para Internet » CSS »

Posicionamientos para foto campo de futbol

Estas en el tema de Posicionamientos para foto campo de futbol en el foro de CSS en Foros del Web. hola a todos, Me gustaria hacer una alineacion en un campo de futbol, y poner todos los jugadores distribuidos dentro del campo, para ello quiero ...
  #1 (permalink)  
Antiguo 08/05/2013, 06:38
 
Fecha de Ingreso: noviembre-2007
Mensajes: 208
Antigüedad: 17 años
Puntos: 2
Posicionamientos para foto campo de futbol

hola a todos,

Me gustaria hacer una alineacion en un campo de futbol, y poner todos los jugadores distribuidos dentro del campo, para ello quiero hacer 4 lineas:

Portero
defensa
centro del campo
delantero

No sé porque me ha salido con unos input text pero a la hora de meter fotos y poner el nombre no me funciona... estoy hecho ya un lio y no sé que mas poner, aqui teneis las capturas de todo:

El codigo



Uploaded with ImageShack.us

El div jugador solo lo he puesto en defensa, pero si lo pongo en los otros es mucho peor porque me salen todos uno debajo de otro y yo quiero que salgan a continuacion con el posicionamiento relativo

CSS usado:



Uploaded with ImageShack.us

El resultado que me sale:



Uploaded with ImageShack.us

He puesto las lineas de color para delimitar las partes del campo para ver si era problema porque no tenia suficiente height, incluso he quitado la defensa entera y he puesto solo el centro del campo y le he dado un alto height para probar que no fuera eso y nada..

Aqui con los input text me sale bien y es el resultado que mas o menos quiero conseguir pero con la foto del jugador y el texto debajo:



Uploaded with ImageShack.us


Estoy ya super desesperado porque es un trabajo que tendria que haber terminado ya ayer y sigo estancado.. he estado mirando tutoriales de posicionamiento pero nada... Ojala podais ayudarme, saludos y gracias de antemano!!
  #2 (permalink)  
Antiguo 08/05/2013, 07:58
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 3 meses
Puntos: 2114
Respuesta: Posicionamientos para foto campo de futbol

Sólo tendrías que flotar a cada jugador.

Código CSS:
Ver original
  1. div.jugador {
  2.   float: left;
  3. }

No sé por qué crees que el posicionamiento relativa va a hacer tal cosa.

Tampoco estaría de más poner código y no imágenes. Para este caso no, pero para cosas un poco más complejas es mejor poner el código.
  #3 (permalink)  
Antiguo 08/05/2013, 13:13
 
Fecha de Ingreso: noviembre-2007
Mensajes: 208
Antigüedad: 17 años
Puntos: 2
Respuesta: Posicionamientos para foto campo de futbol

hola!!!

mil gracias me funciono!!! tantas pruebas y al final era esa tonteria!! ahora lo que no se me centran son los jugadores, he probado centrando el div jugadores o el div de cada posicion es decir medio campo, delantera pero ninguno funciona
  #4 (permalink)  
Antiguo 08/05/2013, 16:11
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 3 meses
Puntos: 2114
Respuesta: Posicionamientos para foto campo de futbol

Los elementos flotados no se puede centrar. Al menos no de forma automática.

Tendrías que quitar ese float y añadir:

Código CSS:
Ver original
  1. div.jugador {
  2.   display: inline-block;
  3. }

Y para que se queden centrados, añadir algo así a su contenedor:

Código CSS:
Ver original
  1. div.campo > div {
  2.   text-align: center;
  3. }

Esto último afectaría las capas hijas directas de .campo, es decir: .portero, .defensa, .centrocampo y .delantero.

Etiquetas: campo, color, foto, futbol
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 15:24.