Pregunta

Tengo una imagen que estará centrado (izquierda y derecha) en la ventana, no hay a la izquierda de la frontera,pero hay un borde derecho.Me preguntaba si es posible que la parte superior de la frontera para ir desde el extremo izquierdo de la página (más allá de la imagen) y se detiene en el borde derecho y el borde inferior de inicio en el extremo izquierdo de la imagen y se extienden a través de todo el camino a la derecha de la ventana.La parte superior e inferior de las fronteras están hechas de dos diferentes repetición de los fondos y el borde izquierdo puede ser demasiado, si es necesario.

He estado pensando en esto por un tiempo, pero no podía llegar a ninguna solución...alguien me puede ayudar?

¿Fue útil?

Solución

Usted podría querer aclarar lo flexible que está dispuesto a ser.Usted puede acercarse a esta de múltiples maneras.¿Desea que la parte superior e inferior de las fronteras que se extienden hasta el borde de la ventanilla (por lo que les sea fluida de ancho)?

Usted puede manejar este uso de imágenes de fondo con background-position y una puerta corredera de la técnica, o puede utilizar extraños de marcado para crear un tres de la columna de fluido de diseño de ancho con su imagen en el centro.

Es hasta usted, pero con las tres columnas de la técnica, puede insertar su extra divs (o lo que usted desea para su uso) a través de JavaScript por lo que no tendría contenedores vacíos en su origen, y el uso de border-top y border-bottom en lugar de las imágenes de fondo (por lo tanto derramamiento de algún tiempo de carga de la página).

Editar: Y para aclarar, usted quiere que se vea algo como esto Ascii dibujo:

_______________
               |img|_____________________

Editar:Para el líquido de diseño de ancho, consulte uno de los muchos numerosas fuentes en CSS Diseños, aquí tienes un buen resumen:http://www.smashingmagazine.com/2007/01/12/free-css-layouts-and-templates/

Después a la izquierda y a la derecha de las columnas, lo haría border-top y border-bottom respectivamente (o usar de fondo-imágenes si desea más elegante de las fronteras), dar a la imagen de las fronteras y tienen la altura de sus tres contenedores conjunto de forma que los bordes se alinean juntos.Espero que ayude.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top