Foros del Web » Creando para Internet » HTML »

problemas con estilos en firefox para hacer una lista

Estas en el tema de problemas con estilos en firefox para hacer una lista en el foro de HTML en Foros del Web. Hola quisiera saber si me podrian ayudar a resolver una lista que cuando la abro en firefox me trae problemas cuando le coloco un link. ...
  #1 (permalink)  
Antiguo 16/04/2010, 14:01
 
Fecha de Ingreso: abril-2010
Mensajes: 1
Antigüedad: 7 años, 7 meses
Puntos: 0
problemas con estilos en firefox para hacer una lista

Hola quisiera saber si me podrian ayudar a resolver una lista que cuando la abro en firefox me trae problemas cuando le coloco un link.

Este es el link donde tengo esta pagina y si lo ven en firefox podran observar que se mueve toda la lista.

Gracias!

http://www.f3ndesign.com/profexor/list.html

Este es el ejemplo de mi boton:

<div id="course_name"><!--course_name-->
<a href="#">
<div id="course_icon">
<div class="css_icon">
</div>
</div>
<div id="course_text">
<div class="course_title">CSS</div>
<div class="course_description">
Aqui va la casa que desarrolla el programa
</div>
<div class="course_author">
Author: Aqui va la casa que desarrolla el programa
</div>
</div>
<div id="course_info">
<div class="course_time">
12h:15m
</div>
<div class="course_chapter_number">
21 Capítulos
</div>
</div>
</a>
</div><!--end course_name-->

Estos son los estilos que le estoy dando en el css:


#main_content #list_content {
float: left;
height: auto;
width: 960px;
background-image: url(../images/bg/bg_list_content.png);
background-repeat: repeat-y;
}


#coming_soon_title {
font-family: Arial, Helvetica, sans-serif;
color: #0bbccc;
font-weight: normal;
font-size: 12px;
text-decoration: none;
margin-top: 30px;
float: left;
width: 680px;
}

#letter_alphabetic_title {
font-family: Arial, Helvetica, sans-serif;
color: #0bbccc;
font-weight: normal;
font-size: 12px;
text-decoration: none;
margin-top: 10px;
float: left;
width: 630px;
margin-bottom: 10px;
background-color: #333834;
margin-right: 40px;
padding-left: 10px;
}

/*course*/

#course_name {
float: left;
height: 70px;
width: 680px;
margin-right: 0px;
background-image: url(../images/bg/bg_course_name_link.png);
background-repeat: no-repeat;
margin-bottom: 0px;
text-decoration: none;
}

#course_icon {
float: left;
height: 70px;
width: 60px;
margin: 0px;
}

#course_text {
float: left;
width: 400px;
height: 70px;
font-family: Arial, Helvetica, sans-serif;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 10px;
text-decoration: none;
}

#course_info {
float: left;
height: 70px;
width: 160px;
padding: 0px;
margin-top: 0px;
margin-right: 40px;
margin-bottom: 0px;
margin-left: 10px;
text-decoration: none;
}

.course_title {
font-family: Arial, Helvetica, sans-serif;
color: #0bbccc;
font-weight: normal;
font-size: 12px;
text-decoration: none;
margin-top: 10px;
float: left;
height: auto;
width: 400px;
}

.course_description {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #999f94;
margin-top: 5px;
float: left;
height: auto;
width: 400px;
text-decoration: none;
}

.course_author {
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
color: #999f94;
margin-top: 5px;
width: 400px;
float: left;
height: auto;
text-decoration: none;
}

.course_time {
font-family: Arial, Helvetica, sans-serif;
color: #0bbccc;
font-weight: normal;
font-size: 12px;
text-decoration: none;
margin-top: 10px;
text-align: right;
margin-right: 10px;
float: left;
width: 150px;
height: auto;
}

.course_chapter_number {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #999f94;
margin-top: 5px;
text-align: right;
margin-right: 10px;
float: left;
width: 150px;
height: auto;
text-decoration: none;
}
/*/course*/

/*course a*/

/*bg don't change*/
#course_name a {
float: left;
height: 70px;
width: 680px;
background-image: url(../images/bg/bg_course_name_link.png);
background-repeat: no-repeat;
text-decoration: none;
}
/*/bg don't change*/

#course_icon a {
float: left;
height: 70px;
width: 60px;
margin: 0px;
}

#course_text a {
float: left;
width: 400px;
height: 70px;
font-family: Arial, Helvetica, sans-serif;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 10px;
text-decoration: none;
}

#course_info a {
float: left;
height: 70px;
width: 160px;
margin-left: 10px;
margin-right: 40px;
}

.course_title a {
font-family: Arial, Helvetica, sans-serif;
color: #0bbccc;
font-weight: normal;
font-size: 12px;
text-decoration: none;
margin-top: 10px;
float: left;
width: 400px;
}

.course_description a {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #999f94;
margin-top: 5px;
float: left;
width: 400px;
text-decoration: none;
}

.course_author a {
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
color: #999f94;
margin-top: 5px;
float: left;
width: 400px;
text-decoration: none;
}

.course_time a {
font-family: Arial, Helvetica, sans-serif;
color: #0bbccc;
font-weight: normal;
font-size: 12px;
text-decoration: none;
margin-top: 10px;
text-align: right;
margin-right: 10px;
float: left;
width: 150px;
}

.course_chapter_number a {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #999f94;
margin-top: 5px;
text-align: right;
margin-right: 10px;
float: left;
width: 150px;
text-decoration: none;
}

/*/course a*/

/*course a:hover*/

/*bg change*/
#course_name a:hover {
float: left;
height: 70px;
width: 680px;
background-image: url(../images/bg/bg_course_name_hover.png);
background-repeat: no-repeat;
text-decoration: none;
}
/*/bg change*/

#course_icon a:hover {
float: left;
height: 70px;
width: 60px;
margin: 0px;
}

#course_text a:hover {
float: left;
width: 400px;
height: 70px;
font-family: Arial, Helvetica, sans-serif;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 10px;
text-decoration: none;
}

#course_info a:hover {
float: left;
height: 70px;
width: 160px;
margin-left: 10px;
margin-right: 40px;
text-decoration: none;
}

.course_title a:hover {
font-family: Arial, Helvetica, sans-serif;
color: #0bbccc;
font-weight: normal;
font-size: 12px;
text-decoration: none;
margin-top: 10px;
float: left;
width: 400px;
}

.course_description a:hover {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #999f94;
margin-top: 5px;
float: left;
width: 400px;
text-decoration: none;
}

.course_author a:hover {
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
color: #999f94;
margin-top: 5px;
float: left;
width: 400px;
text-decoration: none;
}

.course_time a:hover {
font-family: Arial, Helvetica, sans-serif;
color: #0bbccc;
font-weight: normal;
font-size: 12px;
text-decoration: none;
margin-top: 10px;
text-align: right;
margin-right: 10px;
float: left;
width: 150px;
}

.course_chapter_number a:hover {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #999f94;
margin-top: 5px;
text-align: right;
margin-right: 10px;
float: left;
width: 150px;
text-decoration: none;
}

/*/course a:hover*/



/*carrers*/
#career_name {
float: left;
height: 100px;
width: 680px;
background-image: url(../images/bg/bg_career_name_link.png);
margin: 0px;
clear: left;
}




#career_icon {
float: left;
height: 100px;
width: 130px;
margin-top: 0px;
margin-right: 10px;
margin-bottom: 0px;
margin-left: 0px;
}
#career_text {
margin: 0px;
float: left;
width: 330px;
height: 100px;
font-family: Arial, Helvetica, sans-serif;
text-decoration: none;
}
#career_info {
float: left;
height: 100px;
width: 160px;
margin-right: 0px;
margin-left: 10px;
text-decoration: none;
}

.career_title {
font-family: Arial, Helvetica, sans-serif;
color: #0bbccc;
font-weight: normal;
font-size: 12px;
text-decoration: none;
margin-top: 10px;
float: left;
width: 330px;
}
.career_description {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #999f94;
margin-top: 5px;
float: left;
width: 330px;
text-decoration: none;
}
.career_author {
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
color: #999f94;
margin-top: 5px;
float: left;
width: 330px;
text-decoration: none;
}
.career_time {
font-family: Arial, Helvetica, sans-serif;
color: #0bbccc;
font-weight: normal;
font-size: 12px;
text-decoration: none;
margin-top: 10px;
text-align: right;
margin-right: 10px;
width: 150px;
}
.career_chapter_number {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #999f94;
margin-top: 5px;
text-align: right;
margin-right: 10px;
width: 150px;
text-decoration: none;
}





.course_title_coming_soon {
font-family: Arial, Helvetica, sans-serif;
color: #999f94;
font-weight: normal;
font-size: 12px;
text-decoration: none;
margin-top: 10px;
}

.course_launch {
font-family: Arial, Helvetica, sans-serif;
color: #0bbccc;
font-weight: normal;
font-size: 12px;
text-decoration: none;
margin-top: 10px;
text-align: right;
margin-right: 10px;
}

/*-----------ICONS--------------------------------------*/
/*Adobe Softwares*/


.css_icon {
height: 40px;
width: 40px;
margin-top: 15px;
margin-right: auto;
margin-bottom: 15px;
margin-left: auto;
background-image: url(../images/course_icons/web/css.png);
background-repeat: no-repeat;
}


/*-----------END ICONS--------------------------------------*/
  #2 (permalink)  
Antiguo 16/04/2010, 17:05
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 10 años, 5 meses
Puntos: 1567
Respuesta: problemas con estilos en firefox para hacer una lista

FedXs

El código css y html es demasiado extenso para analizarlo a fondo y que no se pase por alto algun detalle. He visto tu página con IE/7/8 Firefox 3.6 y Opera 10, te cuento algunos detalles, en IE tu background aparece al tope de la página lo que le da un buen efecto, pero en Firefox y Opera solo empieza a visualizarse a mitad de página.
en Opera el menú lateral se vé algo distorsionado en el link "Cambiar tarjeta de crédito e información de facturación" En cuanto a la lista central, la que comienza con 3D Studio Max, se ve bien en todos, bueno, aunque tampoco encontré en esa lista ningún vínculo. Así que tu

Cita:
cuando la abro en firefox me trae problemas cuando le coloco un link.
no se bien a que se refiere.
saludos

Etiquetas: estilos, firefox, lista
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 02:57.