[Ovillo] ajustar caja a tamaño foto
hola antes que nada feliz navidad a quienes participan o escuchan en la lista. :-) Entrando en materia, estoy hace hace un tiempo dandole vueltas a una galeria de fotos. El caso es que me han pedido q le de una vuelta mas pero no se como, os explico. Tengo una imagen centrada en un caja, en el original esa caja con sus bordes era una tabla que se ajustaba como un guante a la foto, me han pedido que haga lo mismo en css. Pero no se como :( El problema más grave es cuando la imagen sobre sale de la caja donde está metida. Como hago que se agrande o mengue la caja, en función del tamaño de la foto? Como es un programa que autogenera las paginas web, no se puede preveer el tamaño maximo de las imagenes que se querran mostrar en el album. Gracias, hasta pronto! laura ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] ajustar caja a tamaño foto
Laura: Habría que ver el ejemplo para ser más precisos... pero podés probar esto... ¿Qué pasa si no le ponés medidas a esa caja (ni de ancho ni de alto), y le ponés los márgenes derecho e izquierdo en auto? El alto de las cajas casi siempre se ajusta al contenido (eso te sirve), y el ancho casi siempre ocupa todo el lugar disponible en su contenedor (eso no te sirve), a menos que le especifiques un ancho (tampoco te sirve), o que utilices los márgenes. En este caso si utilizás los márgenes, pero en automático, debiera quedar centrada la caja con respecto a su contenedor, y del ancho de su contenido. Si querés que se ajuste a la foto, pero que no quede centrada, ponele auto únicamente al margen de un lado, por ejemplo al derecho. espero que ayude! saludos! Lucas -- === LucasMourelle - desarrollos rgb === 6343-1705 // 15-5052-1468 [EMAIL PROTECTED] === laura wrote: hola antes que nada feliz navidad a quienes participan o escuchan en la lista. :-) Entrando en materia, estoy hace hace un tiempo dandole vueltas a una galeria de fotos. El caso es que me han pedido q le de una vuelta mas pero no se como, os explico. Tengo una imagen centrada en un caja, en el original esa caja con sus bordes era una tabla que se ajustaba como un guante a la foto, me han pedido que haga lo mismo en css. Pero no se como :( El problema más grave es cuando la imagen sobre sale de la caja donde está metida. Como hago que se agrande o mengue la caja, en función del tamaño de la foto? Como es un programa que autogenera las paginas web, no se puede preveer el tamaño maximo de las imagenes que se querran mostrar en el album. Gracias, hasta pronto! laura ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] ajustar caja a tamaño foto
hola
gracias :) donde tenia el tamaño con px he puesto auto y ahora se
agranda la caja con la foto, auque segun si la foto es tremenda se ve
grandisima la pagina :S, supongo que se podrá reducir el tamaño de la
foto, cuando sea grande de algun modo.
Codigo antiguo en el css:
#all{
background:white;
border:2px solid black;
width:816px;
left:40%;
margin-left:-300px;
margin-top:10px;
position:absolute;
}
#head_text {
border:3px solid black;
float:left;
width:810px;
}
Con el codigo nuevo:
#all{
background:orange;
border:2px solid black;
left:40%;
margin-left:-300px;
margin-right:100px;
margin-top:10px;
position:absolute;
}
#head_text {
border:3px solid black;
float:left;
}
On 12/22/06, Lucas Mourelle [EMAIL PROTECTED] wrote:
Laura:
Habría que ver el ejemplo para ser más precisos... pero podés probar esto...
¿Qué pasa si no le ponés medidas a esa caja (ni de ancho ni de alto), y
le ponés los márgenes derecho e izquierdo en auto?
El alto de las cajas casi siempre se ajusta al contenido (eso te sirve),
y el ancho casi siempre ocupa todo el lugar disponible en su contenedor
(eso no te sirve), a menos que le especifiques un ancho (tampoco te
sirve), o que utilices los márgenes. En este caso si utilizás los
márgenes, pero en automático, debiera quedar centrada la caja con
respecto a su contenedor, y del ancho de su contenido.
Si querés que se ajuste a la foto, pero que no quede centrada, ponele
auto únicamente al margen de un lado, por ejemplo al derecho.
espero que ayude!
saludos!
Lucas
--
===
LucasMourelle - desarrollos rgb
===
6343-1705 // 15-5052-1468
[EMAIL PROTECTED]
===
laura wrote:
hola
antes que nada feliz navidad a quienes participan o escuchan en la lista.
:-)
Entrando en materia, estoy hace hace un tiempo dandole vueltas a una
galeria de fotos. El caso es que me han pedido q le de una vuelta mas
pero no se como, os explico.
Tengo una imagen centrada en un caja, en el original esa caja con sus
bordes era una tabla que se ajustaba como un guante a la foto, me han
pedido que haga lo mismo en css. Pero no se como :(
El problema más grave es cuando la imagen sobre sale de la caja donde
está metida. Como hago que se agrande o mengue la caja, en función del
tamaño de la foto?
Como es un programa que autogenera las paginas web, no se puede
preveer el tamaño maximo de las imagenes que se querran mostrar en el
album.
Gracias, hasta pronto!
laura
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Explorer y alineamiento horizontal de ultima columna de un thead
On 12/21/06, Ignacio Fortea [EMAIL PROTECTED] wrote: Tengo una tabla [...] con todos los textos centrados en sus celdas (text-align: center), pero en explorer el encabezado thead th sale alineado a la izquierda [...] Si le aplicó un align=center en el xhtml a ese th, tampoco me obedece. nunca tuve este tipo de problemas. de hecho, trabaje en muchos back-ends que mostraban registros de bbdd y siempre pude alinear los encabezados de tabla a la izquierda usando solo css. habra alguna posibilidad de que envies el código completo del xhtml y css que estas usando? lo ideal seria que lo puedas subir a algun sitio. sino no se me ocurre por donde empezar a debbugear. saludos. -- inti castro [EMAIL PROTECTED] ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Explorer y alineamiento horizontal de ultima columnade un thead
Buenas. Es muy raro lo que cuentas, ya que por defecto los TH se alinean todos al centro. Si guardas esta tabla en un html en local, podrás comprobarlo. Así que en algún sitio, le estarás forzando a que se alineen a la izquierda. table border=1 width=100% tr thUNO/th thdos/th /tr tr tdtd uno/td tdtd dos/td /tr /table Saludos -Mensaje original- De: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] En nombre de inti castro Enviado el: viernes, 22 de diciembre de 2006 14:02 Para: Ovillo, la lista de CSS en castellano Asunto: Re: [Ovillo] Explorer y alineamiento horizontal de ultima columnade un thead On 12/21/06, Ignacio Fortea [EMAIL PROTECTED] wrote: Tengo una tabla [...] con todos los textos centrados en sus celdas (text-align: center), pero en explorer el encabezado thead th sale alineado a la izquierda [...] Si le aplicó un align=center en el xhtml a ese th, tampoco me obedece. nunca tuve este tipo de problemas. de hecho, trabaje en muchos back-ends que mostraban registros de bbdd y siempre pude alinear los encabezados de tabla a la izquierda usando solo css. habra alguna posibilidad de que envies el código completo del xhtml y css que estas usando? lo ideal seria que lo puedas subir a algun sitio. sino no se me ocurre por donde empezar a debbugear. saludos. -- inti castro [EMAIL PROTECTED] ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Explorer y alineamiento horizontal de ultima columna de unthead
- Original Message - From: Ignacio Fortea [EMAIL PROTECTED] To: 'Ovillo, la lista de CSS en castellano' ovillo@lists.ovillo.org Sent: Thursday, December 21, 2006 5:46 AM Subject: [Ovillo] Explorer y alineamiento horizontal de ultima columna de unthead Buenos días a todos y felices fiestas Tengo una tabla maquetada con css, con todos los textos centrados en sus celdas (text-align: center), pero en explorer el encabezado thead th sale alineado a la izquierda y no obedece al text-align: center que aplicó a todos los th de la tabla. Si le aplicó un align=center en el xhtml a ese th, tampoco me obedece. ¿Alguien se ha encontrado ya con este problema? ¿Cómo lo solucionó? Un saludo y gracias por anticipado. Ignacio Fortea Serlog21 - Consultoría de Recursos Humanos Pso. Sagasta, 62 :: Edificio venus, oficina 4 :: 50006 Zaragoza Tlf. 902 10 40 98 - 976 37 25 06 :: Fax. 976 37 25 30 Y cual es el código en cuestión? No se me ocurre que hiciste mal. Miguel Flores Pixelperu: Arte - Diseño Gráfico - Diseño Web y Usabilidad - http://www.pixelperu.net/ Hosting a Nivel Personal http://www.limanetwork.com/ Telf.: +511 567 7475 . Cel. 9257 9050 - MSN: [EMAIL PROTECTED] ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Explorer y alineamiento horizontal de ultima columna de un thead
On 12/22/06, inti castro [EMAIL PROTECTED] wrote: [...] siempre pude alinear los encabezados de tabla a la izquierda [...] alinear al CENTRO, quise decir, que como bien señalaron en otro mensaje es el comportamiento por defecto de la mayoría de los browsers. -- inti castro [EMAIL PROTECTED] ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] ajustar caja a tamaño foto
hola de nuevo casi lo tengo, me falta un detalle importante que ahora intento mostrar: El margen que queda a la derecha de la foto,(o del cuadro naranja) cuando la foto es relativamente pequeña desaparece al ser esta foto mucho mayor. Este efecto se puede eliminar? Aqui dos ejemplos para hacerme entender mejor, http://laupri.no-ip.org/photo/PHOTON_CSS-ENG/foto-grande.html http://laupri.no-ip.org/photo/PHOTON_CSS-ENG/foto.html gracias! Laura ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
[Ovillo] Saltarse la transparencia del elemento padre
Hola, Ovillo
He leído ya en esta lista que no es posible hacerlo, pero me gustaría
corroborarlo. El caso es que necesito hacer una lista no ordenada en la
que las viñetas se vean mucho más difuminadas que sus textos. Para eso
tengo el siguiente código:
ul {opacity: 0.3;}
li {list-style-type: circle; opacity: 1.0;}
pero nada... se aplica la transparencia a todo, items de la lista incluídos.
Un saludo
Rodrigo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] MAQUETAR Y DISEÑAR EN JAPONÉS
Mira, debes tener el cd de windows xp y ponerlo en el cd-rom de tu pc para instalar unas caracteristicas de windows. Tienes que ir a panel de control y ir a region y de idioma, luego a la pestaña idiomas, y actibas la 2 casillas de COMPATIBILIDAD DE IDIOMA ADICIONAL, luego ve a detalles y selecciona el idioma japones, y ya podras elegir configurar el teclado en japones con la opciones que te da. Si tienes algun duda, pide y sete será... cuestionado. ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Saltarse la transparencia del elemento padre
yo no he podido, y hasta dónde he llegado a leer el tema de la
transparecia en los browsers es un filtro que estos aplican en tiempo de
renderización sobre área del elemento para hacerlo transparente, por lo
que todo lo que esté en esa área pasará a adquirir este efecto :( Si
alguien sabe de alguna alternativa (que no sean imágenes transparentes)
igual que Rodrigo estaría agradecido. Saludos y felices fiestas
El vie, 22-12-2006 a las 16:02 +0100, Rodrigo Álvarez Virgós escribió:
Hola, Ovillo
He leído ya en esta lista que no es posible hacerlo, pero me gustaría
corroborarlo. El caso es que necesito hacer una lista no ordenada en la
que las viñetas se vean mucho más difuminadas que sus textos. Para eso
tengo el siguiente código:
ul {opacity: 0.3;}
li {list-style-type: circle; opacity: 1.0;}
pero nada... se aplica la transparencia a todo, items de la lista incluídos.
Un saludo
Rodrigo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Float me pisan div contenedores
On 12/21/06, Rafa Quesada [EMAIL PROTECTED] wrote:
div id=contenido
div id=col_izq/div
div id=col_der/div
/div
El problema biene cuando col_izq crece (ya que lo hace de forma dinámica)
pues contenido no se adecua a su tamaño.
a ver si esto funciona:
/* layout - clear contained floats
(www.positioniseverything.net/easyclearing.html) */
#contenido:after { content: .; display: block; height: 0; clear:
both; visibility: hidden; }
#contenido { display: inline-block; }
/* [!] ie fix hidden from ie-mac \*/ * html #contenido { height: 1%; }
#contenido { display: block; } /* end hide */
esto es una version actyalizada para IE7 de:
http://www.positioniseverything.net/easyclearing.html
--
inti castro
[EMAIL PROTECTED]
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Bugs en Firefox
Hola a todos, revivo este tema debido a un excelente articulo que salio en
456 Berea Street, en este hilo, incorrectamente se muestra como un bug la
correcta interpretación del modelo de caja y quisiera aportar este articulo
que muestra el w3c Box Model vs el IE Box model.
http://www.456bereastreet.com/archive/200612/internet_explorer_and_the_css_b
ox_model/
Christian Roque Geldres
-Mensaje original-
De: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
En nombre de Lucas Mourelle
Enviado el: lunes, 30 de octubre de 2006 01:24
Para: Ovillo, la lista de CSS en castellano
Asunto: Re: [Ovillo] Bugs en Firefox
Almirante:
Es tal cual como dice Federico: el doctype es absolutamente necesario
para que el navegador identifique de qué tipo y versión de documento se
trata, y dependiendo de eso cómo debe interpretarlo.
Si bien no es su función, algunos navegadores usan el doctype para
elegir entre dos modos de interpretar el box-model, uno correcto y otro
incorrecto; éste último, para mantener compatibilidad con sitios
desarrollados no acorde a los estándares.
Y para evitarle confusiones a aquellas personas que todavía no manejen
con cierta comodidad el concepto de BoxModel ideado por la W3C, va aquí
un ejemplo:
(espero que no tenga errores, si los tiene, avisen por favor)
http://www.lucasmourelle.com.ar/box_model/
...y un par de puntos importantes a tener en cuenta:
- la propiedad height NO INCLUYE las medidas de: padding-top,
padding-bottom, border-top, border-bottom.
- la propiedad width NO INCLUYE las medidas de: padding-left,
padding-right, border-left, border-right.
Por lo tanto, lo que el Sr. Admirante adjudica como un bug de Firefox es
en realidad la manera CORRECTA de interpretar código CSS. Y, como bien
dice Federico, es la misma manera de interpretar que utiliza el Internet
Explorer 6 (o superior) si el archivo tiene un Doctype moderno.
Uno puede pensar que la manera en que se pensó el asunto de las medidas
de ancho y alto del box-model no es la más intuitiva. Al principio
resulta un poco rebuscada, pero con el tiempo uno va notando que no es
un problema. Simplemente hay que recordar que si uno desea que el borde
de una caja mida, de lado a lado, 100 px, habrá que escribir el width
restando el borde de ambos lados, y el padding de ambos lados... por
ejemplo:
SI QUIERO QUE LA SIGUIENTE CAJA MIDA 100 px. DE BORDE A BORDE... tal que:
#caja{
padding: 10px;
border: 2px solid #FF;
}
ENTONCES EL WIDTH DEBERÁ SER = 100 - 10 - 10 - 2 - 2
#caja{
padding: 10px;
border: 2px solid #FF;
width: 76px;
}
De esta manera, el área donde vive el contenido mide 76px de ancho,
pero sumando el padding y los bordes la caja queda con un total de 100px
de ancho.
...espero que sirva a quienes no utilicen mucho CSS.
saludos,
Lucas
--
===
LucasMourelle - desarrollos rgb
===
6343-1705 // 15-5052-1468
[EMAIL PROTECTED]
===
Federico Santoalla wrote:
Estimado Almirante, paso a contestarte:
El 30/10/06, LISTAS[EMAIL PROTECTED] escribió:
Querido Federico: un código bien interpretado no debería requerir
necesariamente un DOCTYPE cuando el comportamiento que de él se espera
sea
obvio, genérico y estándar. El color red es común a todo navegador y
ninguno lo interpretaría como green.
¿Adivina qué? Para que cualquier agente de usuarios (Navegador o
cualquier cosa que lea el html) se entere de como tiene que
interpretar es documento es necesario poner un DOCTYPE. ¿Adivina que
significa? Tipo de documento. En el se identifica la versión HTML
(HTML 4.01 / XHTML 1.0 /etc) y el modo de tratarlo
(estricto/transicional).
Lo del DOCTYPE estricto te lo digo porque de esta manera IE6
interpreta de manera correcta (correcta porque es lo que dice W3C) el
modelo de cajas.
Y por favor, no cierres el tema porque para aquel que esta aprendiendo
queda confuso. Esto no es un BUG y sería útil para aquellos que se
inician en el diseño basado en estándares que reconozcas tu error.
Un Abrazo.
Federico
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
