Hola,
Lo primero disculpad si esto es muy simple y ya se discutió o está resuelto en FAQs, pero es que no lo he encontrado con una búsqueda por encima...
En fín, al grano. Estoy empezando con una página que tiene un index.htm como "start site" y que tiene un título, cuatro imágenes debajo del título y un par de botoncillos de "escoge idioma" y que enlazan con las dos versiones que tendrá la web, una para cada idioma.
El caso es que como he querido hacerla "a palo" con HTML+CSS (que dicen que es como se aprende...), no con programita visual (FP, DW, etc.), y no tengo ni pajolera idea pues me encuentro con problemitas del tipo que os cuento ahora:
Las cuatro imágenes son de 250x250 y deben ir en paralelo horizontalmente con ligera separación entre ellas y con los extremos de la pantalla. Punto 1, mi portátil tiene la pantalla de 15" widescreen. Pruebo la página en el portátil de mi novia, que tiene una de 15" normal y las imágenes se descolocan, montándose unas sobre otras. Y os cuento qué he hecho (probablemente una barbaridad) para colocar las imágenes. En el HTML simplemente he puesto las etiquetas de las 4 imágenes y les he dado una ID a cada una y en la hoja CSS he cogido cada clase y le he dado unos valores de posición en porcentajes, que es lo que había leído que dinamiza las cosas para diferentes resoluciones o pantallas. Para más señas he probado primero a aplicar todos los porcentajes en base a "left" pero eso siempre descuadra las cosas hacia la izquierda en la 15" normal, así que hice las dos de la izquierda basadas en "left" y las otras dos en "right". La pega es que para que en la no-widescreen se vean bien (teniendo en cuenta que la resolución es de 1024 y entre todas las imágenes ya suman 1000 pixels, solo quedan 24 pixels para los pequeños espacios entre ellas y con los márgenes) en la widescreen, con los porcentajes, siempre el espacio entre las dos del medio es mayor que en los extremos o entre las dos de la izquierda o de la derecha. Un poco chafa, en resumen.
Para más inri, lo que estoy tratando de hacer es una versión CSS de una web ya hecha, pero que está basada en los (atención sensibles, no leer más) míticos frames, iframes y, como no, tablas... Sí, lo que leeis. Bien, el caso es que esta misma página inicial que estoy haciendo, usando una tablita para colocar las imágenes (sacrilegio mortal, lo se!), no tiene mayor problema al pasar de no-WS a WS ya que las imágenes están situadas centradas en cada una de las 4 celdas de la tablita... et voilà, el espaciado es constante en ambos casos.
Todo este rollo no es para que os ardan los ojos, es para darle un poco de idea a la historia, que queréis, sintetizo mal... La pregunta es: ¿Puedo y, si sí, cómo puedo hacer que las 4 imágenes estén centradas y tengan un espaciado homogéneo usando CSS? Supongo que usando cajas, pero como no tengo mucha idea, un ejemplito práctico me vendría fetén.
Mil gracias y disculpas por el tostón.
Un saludo
