Comunidad de diseño web y desarrollo en internet online

Ayudita con diseño CSS, please :)

Citar            
MensajeEscrito el 08 Ene 2007 11:33 am
Buenas, estoy diseñando una pagina web para un cliente: http://www.sosfactory.net/webdesign/linerider.com/ pero tengo un par de problemillas con las css.

1º Los titulos "April 7, 2006" de las "Latest News" deberian ser verdes, pero no se pq salen negros.
2º Los "More" deberian estar subrayados en el estado over. Solo me funciona en Firefox.

Si ven cualquier fallo o mala costumbre por favor diganmelo, llevo poco tiempo con Css.
Gracie!!
Sergio

Por sosfactory

135 de clabLevel

1 tutorial

 

msie
Citar            
MensajeEscrito el 08 Ene 2007 02:24 pm
No se si tiene algo que ver pero prueba a usar todo el código en minúsculas:

Código :

.news P.one {
   MARGIN-BOTTOM: 0px;
   font-weight: bold;
   color: 6eba00;
}


el P está en mayúscula y luego:

Código :

<div class="news"> <p class=one>April 7, 2006</p>

en xhtml lo pones en minúsculas

Lo del more tiene solución: Tienes que seguir este orden

Código :

a:link { }
a:visited { }
a:hover { }
a:active { }

Por ryuz

350 de clabLevel

2 tutoriales

 

firefox
Citar            
MensajeEscrito el 08 Ene 2007 02:33 pm
Gracias, lo del over ya esta solucionado.

Me queda lo de el color verde, puse todo en minusculas, pero sigue sin funcionar.

Por sosfactory

135 de clabLevel

1 tutorial

 

msie
Citar            
MensajeEscrito el 08 Ene 2007 02:59 pm
Fijate que tonteria era lo del color...

Resulta que ponia 98B801 en lugar de #98B801, dreamweaver me pillaba el color pero el browser no :)

Pues ale diseño terminado :)
Gracias

Por sosfactory

135 de clabLevel

1 tutorial

 

msie
Citar            
MensajeEscrito el 12 Ene 2007 05:16 pm
jejejeje bueno el sitio... pero por que no le pones fixed al fondo, a la imagen de las rallitas... es decir

Código :

background-attachment: fixed;


creo que se veria mejor, es solo una sugerencia...

Por buzu

163 de clabLevel



 

Los Angeles, California

firefox
Citar            
MensajeEscrito el 12 Ene 2007 06:03 pm
Gracias por el consejo, me puedes explicar para que vale esa propiedad?

Por sosfactory

135 de clabLevel

1 tutorial

 

msie
Citar            
MensajeEscrito el 12 Ene 2007 06:08 pm
deja el bg en una posicion, en este caso arriva, y aun que hagas scroll se queda arriva... no hace scroll...

Por buzu

163 de clabLevel



 

Los Angeles, California

firefox
Citar            
MensajeEscrito el 12 Ene 2007 10:29 pm
Lo siento Buzu, no te pillo. Q navegador usas? Yo ahora mismo lo veo fijo.

Por sosfactory

135 de clabLevel

1 tutorial

 

msie
Citar            
MensajeEscrito el 13 Ene 2007 05:26 pm
si presisamente, la funcion de esa propiedad es dejar el bg en un solo lugar, al hacer scroll no se mueve... yo uso firefox y al hacer scroll el bg se mueve... por cierto el efecto de las lineas que crusan en el contenido es puro css??? si es asi, es una forma ingeniiosa... :lol: :lol:

Por buzu

163 de clabLevel



 

Los Angeles, California

firefox
Citar            
MensajeEscrito el 13 Ene 2007 05:35 pm
Sip, todo es css menos las primeras curvitas q estan en la imagen del header :)
En principio pense poner imagenes, pero despues se me ocurrio hacerlo con la propiedad borde... se pierden las curvitas pero se ahorran imagenes, espacio y trabajo :)

Lo del BG sigo sin cogerlo, yo uso Firefox tb pero no se me mueve... a alguien mas le pasa? Q resolucion usas? (aunque no creo q tenga nada q ver).

Gracias ;)

Por sosfactory

135 de clabLevel

1 tutorial

 

msie
Citar            
MensajeEscrito el 13 Ene 2007 05:47 pm
Sí que se mueve con firefox (actualmente a dia 13-1-2007 18,44 gtm+1), lo que quiere decir es que cuando haces scroll sobre la página, el degradado que hay arriba, que va desde gris a blanco, se mueve según haces scroll. Lo que pretende con la posición fixed es dejarlo "fijo", que al hacer el scroll no se mueva, aunque sí se mueva el resto del contenido de la página.

Por Johnny

Claber

1589 de clabLevel

4 tutoriales

  Héroes

firefox
Citar            
MensajeEscrito el 13 Ene 2007 06:34 pm
no tiene nada que ver al resolucion y no digo que seas mentiroso pero no creo que no se te mueva... por que no tienes la propiedad que te digo en tu CSS, me imagine que hacias el efecto con bordes, pero me dio flojera revisar el css, es una idea ingeniosa, esperemos que ya no tarde el CSS3 y entonces podras poner las curvitas...

Por buzu

163 de clabLevel



 

Los Angeles, California

firefox
Citar            
MensajeEscrito el 13 Ene 2007 09:18 pm
A ver... creo q es q tenemos conceptos diferentes de lo q es movimiento.

Yo cuando hago scroll la parte gris se queda arriba (es decir... el fondo no se mueve de donde estaba, q por otro lado es lo q quiero que haga), total que solo se ve la parte en blanco.

Aqui te dejo una captura... supongo que hablamos de lo mismo pero tomamos diferentes referencias.
http://www.sosnewbie.com/video/scroll/scroll.html

Para ti dejarlo fijo significa q siempre ves la parte gris. Es eso? Si no sigo sin entenderlo :)

Si con css3 se pueden hacer curvas ya estoy deseando que llegue tb :)

Por sosfactory

135 de clabLevel

1 tutorial

 

msie
Citar            
MensajeEscrito el 13 Ene 2007 11:58 pm

sosfactory escribió:

Para ti dejarlo fijo significa q siempre ves la parte gris. Es eso?

Efectivamente, es eso, de la otra forma se "iría hacia arriba" al hacer scroll.

Qué versión de IE usas?? es que es raro que lo veas así.

Por Johnny

Claber

1589 de clabLevel

4 tutoriales

  Héroes

firefox
Citar            
MensajeEscrito el 14 Ene 2007 12:22 am
Ah ok, al fin te entendi :)

Para este diseño prefiero asi, pero esta bien conocer esa propiedad.

De IE uso la 6.0.29

Por sosfactory

135 de clabLevel

1 tutorial

 

msie
Citar            
MensajeEscrito el 14 Ene 2007 12:52 am
Pues es raro, debería subirse al hacer el scroll...

Aunque sea un poco redundante y pesado, revisa el código para dejarlo perfecto, por ejemplo con líneas como esta,

Código :

background:url(../images/bg.jpg) repeat-x;

para dejarlas como esta

Código :

background:#FFFFFF url(../images/bg.jpg) repeat-x fixed top;

No es imprescindible, pero es una buena costumbre, por lo menos a mi parecer...

Por Johnny

Claber

1589 de clabLevel

4 tutoriales

  Héroes

firefox
Citar            
MensajeEscrito el 14 Ene 2007 01:02 am
Gracias Johnny, esa es la idea... aun controlo bastante poco de css, asi que estos encargos me sirven de practica.

Me puedes explicar que ventajas tiene? background:#FFFFFF url(../images/bg.jpg) repeat-x fixed top;

Por sosfactory

135 de clabLevel

1 tutorial

 

msie
Citar            
MensajeEscrito el 14 Ene 2007 09:54 am
Bueno, en tu caso es con scroll, en vez de fixed. (para como lo quieres dejar)

Código :

background:#FFFFFF url(../images/bg.jpg) repeat-x scroll top


Es mejor porque por un lado ahorras código, por otro (o al menos cuando has aprendido un poco) es más claro, y por otro, los valores por defecto de cada navegador (dejando a un lado las interpretaciones del modelo de cajas y esas cosas) pueden variar, así que si te acostumbras a decir "vamos a ponerle el fondo" y pones esa línea, en vez de:

Código :

background:url(../images/bg.jpg) repeat-x

te puedes ahorrar tener que estar retocando, imagínate que en un navegador te sale la imágen en el centro de la pantalla, en vez de en la parte superior; o que en otro se queda en fixed, en vez de scroll, por ejemplo...
Así lo haces de un tirón, y si hay errores es más facil detectarlos.
Todo esto te lo digo desde mi punto de vista, no es ningún canon, pero a mí por lo menos me ayuda.
Toda la información que necesitas en: Guía de Referencia
CSS 2.1


(Eso hay que aprenderselo como el "Padre Nuestro")

Saludos :wink:

Por Johnny

Claber

1589 de clabLevel

4 tutoriales

  Héroes

firefox
Citar            
MensajeEscrito el 15 Ene 2007 05:00 pm
si, creo que hablabamos de cosas distintas, para mi estar fijo es no moverse de donde esta, pero para ti estar fijo es permanecer en el mismo sitio con relacion a la pagina y no a la ventana que es a lo que yo me referia.

Por buzu

163 de clabLevel



 

Los Angeles, California

firefox
Citar            
MensajeEscrito el 15 Ene 2007 05:04 pm
Exacto, todo comprendido... en cuanto pueda añado lo que sugeria Johnny.

Si ven algo mas que se pueda mejorar adelante :)

Por sosfactory

135 de clabLevel

1 tutorial

 

msie

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.