Re: [Ovillo] Maquetando cabecera con CSS
Muchas gracias!! tu código me ha venido genial ^^
Saludos! =)
> From: [EMAIL PROTECTED]
> To: ovillo@lists.ovillo.org
> Date: Mon, 31 Mar 2008 21:51:43 +0200
> Subject: Re: [Ovillo] Maquetando cabecera con CSS
>
>
> Hola, aquí te adjunto un css y el xhtml válido que creo que te servirán:
>
>
> body {background-color: #cd;font-size: 11px;font-family: Verdana, Arial,
> SunSans-Regular, Sans-Serif;color:#564b47;padding:0;margin:0;}
> #container {width: 900px;margin-bottom: 10px;margin: 0 auto;background-color:
> #EBD3E0;}
> #centro {background-color: #ff;padding: 0px;margin: 0px 250px 0px 200px;}
> #izquierda {float: left;width: 200px;margin: 0;padding: 0;}
> #derecha {float: right;width: 250px;margin: 0;padding: 0;}
> #bajo {clear: both;margin: 0;padding: 0;text-align: left; }
>
>
>
> Izquierda
> Derecha
> Centro
> Poner aquí el resto de la web, en el caso de que haya
>
>
>
>
> Saludos
>
> > From: [EMAIL PROTECTED]> To: ovillo@lists.ovillo.org> Date: Mon, 31 Mar
> > 2008 17:28:21 +0200> Subject: [Ovillo] Maquetando cabecera con CSS> > >
> > Hola a [EMAIL PROTECTED],> > estoy maquetando la cabecera de mi web con
> > CSS. Tiene tres elementos, que son: una logo, un título y un botón; van los
> > tres colocados, formando una línea horizontal. Ya casi lo tengo, pero no
> > consigo cuadrar la imagen.> > Tengo este CSS:> > /*cabecera*/#L_CabTabla
> > {/*cabecera*/ POSITION:relative; top:1px; left:5px; WIDTH:617px;
> > background-color:#6557D0;}#L_CabLogo {/*img.*/ left:5px; width:55px;
> > background-color:#5215B4; border-right:3px solid #ff;}#L_CabTitulo
> > {/*titulo general*/ POSITION:absolute; text-align:left; top:1px; left:68px;
> > padding-left:4px; padding-right:4px;}/*boton salir SSPP*/#L_SALIR {
> > POSITION:absolute; z-index:1; top:1px; left:505px; width:50px; color:white;
> > cursor:pointer; BACKGROUND-COLOR:transparent; TEXT-ALIGN:center;
> > font-weight:bold; BORDER-style:solid; BORDER-width:2px}> > y este HTML
> > asociado:> > > > > id="L_CabLogo">> > border="0">> > > > >
> > Bienvenidos aPortal SV> > > > > id="L_SALIR">> > onmouseover="javascript:document.getElementById('textosalir').style.color='red'"
> > onmouseout="document.getElementById('textosalir').style.color='white'"
> > href="javascript:salir();">> Salir> >
> > > > > > Con esto, consigo obtener un bloque centrado,
> > donde aparecen el título (centrado), el botón de Salir (a la derecha del
> > texto) y la imagen, que sale también centrada, superpuesta bajo el texto.
> > Lo que yo quiero es que salga a la izquierda de éste. Lo intenté poniéndole
> > a su capa float:left, y aunque IE lo coge en FF no sale bien.> > Muchas
> > gracias desde ya!> > Saludos =)> >
> > _>
> > Tecnología, moda, motor, viajes,…suscríbete a nuestros boletines para estar
> > siempre a la última> Guapos y guapas, clips musicales y estrenos de cine. >
> > ___> 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
> _
> La vida de los famosos al desnudo en MSN Entretenimiento
> http://entretenimiento.es.msn.com/
> ___
> 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
_
La vida de los famosos al desnudo en MSN Entretenimiento
http://entretenimiento.es.msn.com/
___
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] Maquetando cabecera con CSS
Hola a [EMAIL PROTECTED],
estoy maquetando la cabecera de mi web con CSS. Tiene tres elementos, que son:
una logo, un título y un botón; van los tres colocados, formando una línea
horizontal. Ya casi lo tengo, pero no consigo cuadrar la imagen.
Tengo este CSS:
/*cabecera*/#L_CabTabla {/*cabecera*/ POSITION:relative; top:1px; left:5px;
WIDTH:617px; background-color:#6557D0;}#L_CabLogo {/*img.*/ left:5px;
width:55px; background-color:#5215B4; border-right:3px solid
#ff;}#L_CabTitulo {/*titulo general*/ POSITION:absolute; text-align:left;
top:1px; left:68px; padding-left:4px; padding-right:4px;}/*boton salir
SSPP*/#L_SALIR { POSITION:absolute; z-index:1; top:1px; left:505px; width:50px;
color:white; cursor:pointer; BACKGROUND-COLOR:transparent; TEXT-ALIGN:center;
font-weight:bold; BORDER-style:solid; BORDER-width:2px}
y este HTML asociado:
Bienvenidos aPortal SV
Salir
Con esto, consigo obtener un bloque centrado, donde aparecen el título
(centrado), el botón de Salir (a la derecha del texto) y la imagen, que sale
también centrada, superpuesta bajo el texto. Lo que yo quiero es que salga a la
izquierda de éste. Lo intenté poniéndole a su capa float:left, y aunque IE lo
coge en FF no sale bien.
Muchas gracias desde ya!
Saludos =)
_
Tecnología, moda, motor, viajes,…suscríbete a nuestros boletines para estar
siempre a la última
Guapos y guapas, clips musicales y estrenos de cine.
___
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] Background para table en FF / IE
Hola a [EMAIL PROTECTED]
muchas gracias, he conseguido que la imagen salga de fondo en ambos navegadores
^^
en el css lo he cambiado por:
#tableNews
{
background: transparent url(img/background_htable.gif) no-repeat left top;
width: 572px;
height: 171px;
text-align: center;
vertical-align: top;
margin:0;
}
y desde la pagina, antes llamaba al estilo de la tabla con "class" (y en css
declarado como .tableNews), pero al usar en su lugar el atributo "id" (y
declarar como #tableNews en css), ya funciona =)
Gracias!
> From: [EMAIL PROTECTED]
> To: ovillo@lists.ovillo.org
> Date: Tue, 19 Feb 2008 11:13:33 -0300
> Subject: Re: [Ovillo] Background para table en FF / IE
>
> Intenta con background-image:url(img/etc etc etc
>
> -Mensaje original-
> De: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
> En nombre de Rodrigo Álvarez Virgós
> Enviado el: Martes, 19 de Febrero de 2008 11:06
> Para: Ovillo, la lista de CSS en castellano
> Asunto: Re: [Ovillo] Background para table en FF / IE
>
> Hola, SiMs ViKiTo
>
> SiMs ViKiTo escribió:
> > Hola a [EMAIL PROTECTED],
> > Vereis, tengo una tabla a la que doy el siguiente estilo:
> >
> > .tableNews
> > {
> > background: url(img/background_htable.gif);
> > background-repeat: no-repeat;
> > background-color: #FF;
> > background-position: left top;
> > width: 572px;
> > height: 171px;
> > text-align: center;
> > vertical-align: top;
> > cellpadding:0;
> > margin:0;
> > }
> >
> > El problema lo tengo con la imagen del background, que Firefox si me lo
> coge, pero en Explorer no sale nada. He probado de varias formas, pero
> explorer no me lo coge, es muy raro. Por si tuviese algo que ver, la tabla
> está generada con DOM, y la sitúo dentro de un , que está a su vez
> dentro de algunas .
> >
> Prueba con poner todas las propiedades para el fondo en una sola línea:
> background: #fff url('img/background_htable.gif') no-repeat top left;
> o bien pon background-image: url('img/background_htable.gif'); para
> indicar la imagen de fondo
>
> Aparte, cellpadding no es una propiedad css. Si quieres que no haya
> espacio entre las celdas, usa border-collapse:collapse;
> ___
> 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
_
La vida de los famosos al desnudo en MSN Entretenimiento
http://entretenimiento.es.msn.com/
___
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] Background para table en FF / IE
Hola a [EMAIL PROTECTED],
Vereis, tengo una tabla a la que doy el siguiente estilo:
.tableNews
{
background: url(img/background_htable.gif);
background-repeat: no-repeat;
background-color: #FF;
background-position: left top;
width: 572px;
height: 171px;
text-align: center;
vertical-align: top;
cellpadding:0;
margin:0;
}
El problema lo tengo con la imagen del background, que Firefox si me lo coge,
pero en Explorer no sale nada. He probado de varias formas, pero explorer no me
lo coge, es muy raro. Por si tuviese algo que ver, la tabla está generada con
DOM, y la sitúo dentro de un , que está a su vez dentro de algunas .
Muchas gracias
Saludos
_
MSN Video.
http://video.msn.com/?mkt=es-es
___
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] Div's IE vs Div's FF
Hola a todos,
Muchas gracias a todos por vuestra ayuda
Se trata de una tabla que voy generando dinámicamente con Java. Inicialmente la
hice con , pero empecé a usar para tener toda la página maquetada
con capas y css. Sin embargo, y aunque con lo que me habeis comentado conseguí
ponerlo como quería, las capas me estaban volviendo loco, asi que lo he dejado
con table. Supongo que el tener la web maquetada con css no implica que haga
con capas el 100% de las cosas! hehehe =)
Saludos
- ViKiTo
> From: [EMAIL PROTECTED]
> To: ovillo@lists.ovillo.org
> Date: Mon, 28 Jan 2008 09:05:53 -0200
> Subject: Re: [Ovillo] Div's IE vs Div's FF
>
> Vikito:
>
> Si lo que quieres es respetar los estándares de maquetación, es correcto
> utilizar tablas para tabular datos. En este caso, por lo que vi, eso es lo
> que estás haciendo.
>
> Por otro lado, si lo que quieres es complicarte la vida solucionando
> detalles de renderizado entre IE y FF me parece perfecto que estés usando
> DIVs. Sólo recuerda que las tablas se verán exactamente iguales en ambos
> navegadores y no te traerán dolores de cabeza.
>
> Javier Trejo
> Diseñador Web
>
> JT - Comunicación Interactiva
> www.cominteractiva.com.ar
> Cel.: +54 (11) 15 6485-7734
> Nextel: 54*147*423
> Mail: [EMAIL PROTECTED]
> MSN: [EMAIL PROTECTED]
> Skype: trejo.javier
>
> -----Mensaje original-
> De: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
> En nombre de SiMs ViKiTo
> Enviado el: lunes, 28 de enero de 2008 07:02
> Para: ovillo@lists.ovillo.org
> Asunto: [Ovillo] Div's IE vs Div's FF
>
>
> Hola a todos,
>
> Tengo una cuestión de divs que no consigo resolver. Se trata de una tabla,
> en la que las columnas son de la siguiente clase CSS:
>
> .DatoTabla{
> font-size: 12px;
> font-weight : bold;
> text-align:left;
> width:20%;
> display: inline;
> color: #FF;
> background-color: #6557D0;
> overflow:hidden;
> }
>
> Voy colocando las capas una tras otra, y las capas van quedando en linea,
> formando las celdas de la tabla. El problema viene porque en IE el width de
> 20% se cumple, y hace que queden con una separación entre sí, sin embargo,
> en Firefox se quedan juntas, y aparecen los textos pegados unos a otros.
> Creo que se debe a que Firefox ajusta el tamaño de la capa a su contenido,
> sin embargo IE mantiene cierto tamaño independientemente del contenido :S
>
> Este es el codigo de la pagina:
>
>
> Nombre
> Nick
> Email
> URL
>
>
> donde la clase Tabla es,
>
> .Tabla{
> width:100%;
> text-align:left;
> margin: auto;
> background-color: #D2D8F9;
> }
>
> Muchas gracias
>
> Saludos
>
> - ViKiTo =)
>
> _
> La vida de los famosos al desnudo en MSN Entretenimiento
> http://entretenimiento.es.msn.com/
> ___
> 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
_
MSN Noticias
http://noticias.msn.es/comunidad.aspx
___
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] Div's IE vs Div's FF
Hola a todos,
Tengo una cuestión de divs que no consigo resolver. Se trata de una tabla, en
la que las columnas son de la siguiente clase CSS:
.DatoTabla{
font-size: 12px;
font-weight : bold;
text-align:left;
width:20%;
display: inline;
color: #FF;
background-color: #6557D0;
overflow:hidden;
}
Voy colocando las capas una tras otra, y las capas van quedando en linea,
formando las celdas de la tabla. El problema viene porque en IE el width de 20%
se cumple, y hace que queden con una separación entre sí, sin embargo, en
Firefox se quedan juntas, y aparecen los textos pegados unos a otros. Creo que
se debe a que Firefox ajusta el tamaño de la capa a su contenido, sin embargo
IE mantiene cierto tamaño independientemente del contenido :S
Este es el codigo de la pagina:
Nombre
Nick
Email
URL
donde la clase Tabla es,
.Tabla{
width:100%;
text-align:left;
margin: auto;
background-color: #D2D8F9;
}
Muchas gracias
Saludos
- ViKiTo =)
_
La vida de los famosos al desnudo en MSN Entretenimiento
http://entretenimiento.es.msn.com/
___
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
