Css inline internet explorer problem

unicef · 16. januar 2006

Jeg prøver å lage en vanrett meny med popup i css. Problemet er at internet explorer kun viser denne loddrett.

Css koden er:

* {
   padding: 0;
   margin: 0;
   font-family: Arial, sans-serif;
   
 	}
 	
 	body {
   margin: 20px;
   font-size: 12px;
   behavior: url(csshover.htc);
 	}
 	
 	ul {
   list-style: none;
   width: 125px;
   list-style-type: none;
   float: inherit;
   display: inline;

 	}

 	ul a {
   color: #FFF;
   text-decoration: none;
   display: block;
   padding: 5px 5px 5px 10px;
   width: 125px;
   background: #333;
   float: left;
 	}
 	
 	ul a:hover {
   color: #4BD8FF;
   text-decoration: none;
   background: #3C3C3C;
 	}
 	
 	ul li {
   border-bottom: 1px solid #FFF;
   float: left;
   position: relative;
   display: inline;
 	}
 	
 	ul li ul {
   list-style: none;
   position: absolute;
   down: 140px;
   top: 25px;	
   display: none;
   width: 125px;
   border-left: 1px solid #FFF;
 	}
 	
 
 	
 	ul li:hover ul { display: block; }

Html koden er:

<ul>
 	<li><a href="index.html">Home</a></li>
 	<li><a href="about.html">About</a></li>
 	<li><a href="gallery.html">Gallery</a>
   <ul>
   	<li><a href="gallery1.html">Gallery 1</a></li>
   	<li><a href="gallery2.html">Gallery 2</a></li>
   	<li><a href="gallery3.html">Gallery 3</a></li>
   	<li><a href="gallery4.html">Gallery 4</a></li>
   </ul>
 	</li>

Problemet med popup funksjonen i IE er fikset (behavior: url(csshover.htc), det som er rart er at hvis jeg ikke har en <html> tag i starten av html filen så vises denne vannrett i IE, men hvis det står <html> i starten av filen så blir den loddrett. Jeg har funnet koden på internett, der den egentlig var loddrett, det jeg har gjort for å få den vannrett er å legge til "display: inline;" under ul {..}. Da blir den vannrett i opera men ikke i IE

Jeg kan ikke så veldig mye css, så det hadde vært fint med litt hjelp

endrebjo · 16. januar 2006

Du har ihvertfall glemt å avslutte <ul>.

Fungerer det bedre med:

<ul>
 <li><a href="index.html">Home</a></li>
 <li><a href="about.html">About</a></li>
 <li><a href="gallery.html">Gallery</a>
  <ul>
   <li><a href="gallery1.html">Gallery 1</a></li>
   <li><a href="gallery2.html">Gallery 2</a></li>
   <li><a href="gallery3.html">Gallery 3</a></li>
   <li><a href="gallery4.html">Gallery 4</a></li>
  </ul>
 </li>
</ul>

unicef · 17. januar 2006

ops, var en liten kopieringsfeil der :whistle:

funkweb · 19. januar 2006

<div id="horisontal-meny">
<ul>
   <li id="active"><a href="index.htm">Index / Forsiden</a></li>
   <li><a href="kategori-2.html">Eggs</a></li>
   <li><a href="#">Cheese</a></li>
   <li><a href="#">Vegetables</a></li>
   <li><a href="#">Fruit</a></li>
   </ul>
</div>

#horisontal-meny ul {
list-style-type: none; /* Fjerner bullets */
margin: 0;
padding: 0;
text-align: center;
}

/* Tvinger listen til å bli en rett strek meny */
#horisontal-meny ul li { 
display: inline;
}

#horisontal-meny ul li a { 
text-decoration: none; /* Fjerner under-streken */
padding: .2em 1em; /* Sørger for å gjøre enkelte av dem i et egen "boks" i a statment */
color: #fff;
background-color: #036; /* Legg til bakgrunnsfarge for a statment */
} 


/* bakgrunnsfarge for rollover + tekst. */
#horisontal-meny ul li a:hover {
color: #fff;
background-color: #369;
}

/* Aktiv side */

#active a { 
color: #fff; 
background-color: #002142;
text-decoration: none;
}

Håper dette er til hjelp.!! :w00t:

unicef · 26. januar 2006

Hei. Takk for det. Det var noe xhtml greier også som blandet seg inn der. Vet ikke helt hva det var som gjorde at det ikke funket men.. jaja

Logg inn

Css inline internet explorer problem

Anbefalte innlegg

unicef

Videoannonse

endrebjo

unicef

funkweb

unicef

Opprett en konto eller logg inn for å kommentere

Opprett konto

Logg inn

Hvem er aktive 0 medlemmer