zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Darstellungsprobleme im IE ( Wo sonst :/ ) ! Hilfe !

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 10.02.2007, 03:52
j4n j4n ist offline
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.02.2007
Beiträge: 2
j4n befindet sich auf einem aufstrebenden Ast
Standard Darstellungsprobleme im IE ( Wo sonst :/ ) ! Hilfe !

Hi Leute,

mein Problem ist folgendes: Ein Kunde möchte ein variables Menü, welches er aus typo3 herraus einfach bearbeiten kann, daher fallen Tabellen, oder ähnliches, schonmal raus.

Ich hab mich dann für CSS entschieden, lief auch alles wunderbar. Bis ich an dem Punkt war, mein Menü fix im IE zu betrachten. Opera und Firefox problemfrei, aber der IE streßt natürlich.

Hab mir nun schon einige Theards durchgelesen und auch einiges probiert, aber wirklich richtig funktionieren will es dennoch nicht.

Also nach dem Motto, viele Augen sehen mehr als zwei - hoffe ich, einer von euch weiß vielleicht woran es liegt.

Besten Dank im Vorraus.

Grüße Jan

--------------------------------------------

Fehler in der Darstellung ( Link ):

Navigation

Firefox: funktioniert
IE: funktioniert nicht.

Quellcode:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>Navigation</title>
<style type="text/css">
/* Main Navigation */

#main_navigation {
float: left;
background-image:url(_images/bg_navi.jpg);
background-repeat:repeat-x;
width:1000px;
height:29px;
margin:0px;
clear:both;
}

#main_navigation ul {
padding:0px;
margin-top: 2px;
color: #000000;
}

#main_navigation li {
display: inline;
}

#main_navigation a {
display: inline;
font: normal 11px Verdana, Arial, Helvetica, sans-serif;
text-decoration:none;
margin:0;
color: #000000;
}

#main_navigation ul li a {
background-image:url(_images/bgnavi_re.jpg);
background-position:100% 0%;
background-repeat: no-repeat;
padding: 10px 10px 15px 0px;
}

#main_navigation ul li a span {
background-image:url(_images/bgnavi_li.jpg);
background-position: 0% 0%;
background-repeat: no-repeat;
padding: 10px 0px 15px 10px;
}

#main_navigation ul li a:hover {
background-image:url(_images/bgnavi_re_on.jpg);
background-position:100% 0%;
background-repeat: no-repeat;
}

#main_navigation ul li a:hover span {
background-image:url(_images/bgnavi_li_on.jpg);
background-position: 0% 0%;
background-repeat: no-repeat;
}

/** annderer bg für News **/

#main_navigation .vnews a {
background-image:url(_images/bg_navi_news_re.jpg);
background-position:100% 0%;
background-repeat: no-repeat;
color:#FFFFFF;
font: bold 11px Verdana, Arial, Helvetica, sans-serif;
text-transform:uppercase;
}

#main_navigation .vnews a span {
background-image:url(_images/bg_navi_news_li.jpg);
background-position: 0% 0%;
background-repeat: no-repeat;
}

#main_navigation .vnews a:hover {
background-image:url(_images/bg_navi_news_re_on.jpg);
background-position:100% 0%;
background-repeat: no-repeat;
color:#444444;
font: bold 11px Verdana, Arial, Helvetica, sans-serif;
text-transform:uppercase;
}

#main_navigation .vnews a:hover span {
background-image:url(_images/bg_navi_news_li_on.jpg);
background-position: 0% 0%;
background-repeat: no-repeat;
}

#main_navigation cursor: pointer;
</style>
</head>

<body>
<div id="main_navigation">
<ul>
<li><a href="#"><span>Ausstellung</span></a></li>
<li><a href="#"><span>BMZ</span></a></li>
<li><a href="#"><span>KLub</span></a></li>
<li><a href="#"><span>Veranstaltungen</span></a></li>
<li class="vnews"><a href="#"><span>News</span></a></li>
<li><a href="#"><span>Termine</span></a></li>
<li><a href="#"><span>Kontakt</span></a></li>
<li><a href="#"><span>Anfahrtsskizze</span></a></li>
<li><a href="#"><span>Impressum</span></a></li>
</ul>
</div>
</body>
</html>
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 10.02.2007, 14:24
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Eine pixelgenaue Tab-Navigation im Inline-Kontext. Hm.

Ein Ansatz für den IE wäre seine "sort-of" inline-block-Darstellung.
IE/Win: inline-block and hasLayout

Sinnvoller fände ich den Einsatz von float statt display:inline.
Bekanntes Beispiel: A List Apart: Articles: Sliding Doors of CSS, Part II
Mit den zusätzlichen spans, du du jetzt schon benutzt, sollte ein :hover des gesamten Hintergrunds möglich sein.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 11.02.2007, 23:04
j4n j4n ist offline
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.02.2007
Beiträge: 2
j4n befindet sich auf einem aufstrebenden Ast
Standard

Hab die Sachen gefixt und nun funktionierts. Aller besten Dank nochmal
Nun funktioniert die Seite auch im blöden IE .

Danke! Gruß Jan =)

---------------------------

Navigation


Quelltext:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Navigation</title>
<style type="text/css">
/* Main Navigation */

#main_navigation {
float: left;
background-image:url(_images/bg_navi.jpg);
background-repeat:repeat-x;
width:1000px;
height:29px;
margin:0px;
clear:both;
}

#main_navigation ul {
display: inline;
padding:0px;
margin-top: 2px;
color: #000000;
}

#main_navigation li {
display: inline;
margin:0;
padding:0;;
}

#main_navigation a {
float:left;
font: normal 11px Verdana, Arial, Helvetica, sans-serif;
text-decoration:none;
margin:0;
color: #000000;
}

#main_navigation ul li a {
background-image:url(_images/bgnavi_re.jpg);
background-position:100% 0%;
background-repeat: no-repeat;
padding: 10px 10px 15px 0px;
}

#main_navigation ul li a span {
background-image:url(_images/bgnavi_li.jpg);
background-position: 0% 0%;
background-repeat: no-repeat;
padding: 10px 0px 15px 10px;
}

#main_navigation ul li a:hover {
background-image:url(_images/bgnavi_re_on.jpg);
background-position:100% 0%;
background-repeat: no-repeat;
}

#main_navigation ul li a:hover span {
background-image:url(_images/bgnavi_li_on.jpg);
background-position: 0% 0%;
background-repeat: no-repeat;
}

/** annderer bg für News **/

#main_navigation .vnews a {
background-image:url(_images/bg_navi_news_re.jpg);
background-position:100% 0%;
background-repeat: no-repeat;
color:#FFFFFF;
font: bold 11px Verdana, Arial, Helvetica, sans-serif;
text-transform:uppercase;
}

#main_navigation .vnews a span {
background-image:url(_images/bg_navi_news_li.jpg);
background-position: 0% 0%;
background-repeat: no-repeat;
}

#main_navigation .vnews a:hover {
background-image:url(_images/bg_navi_news_re_on.jpg);
background-position:100% 0%;
background-repeat: no-repeat;
color:#444444;
font: bold 11px Verdana, Arial, Helvetica, sans-serif;
text-transform:uppercase;
}

#main_navigation .vnews a:hover span {
background-image:url(_images/bg_navi_news_li_on.jpg);
background-position: 0% 0%;
background-repeat: no-repeat;
}

#main_navigation cursor: pointer;
</style>
</head>

<body>
<div id="main_navigation">
<ul>
<li><a href="#"><span>Ausstellung</span></a></li>
<li><a href="#"><span>BMZ</span></a></li>
<li><a href="#"><span>KLub</span></a></li>
<li><a href="#"><span>Veranstaltungen</span></a></li>
<li class="vnews"><a href="#"><span>News</span></a></li>
<li><a href="#"><span>Termine</span></a></li>
<li><a href="#"><span>Kontakt</span></a></li>
<li><a href="#"><span>Anfahrtsskizze</span></a></li>
<li><a href="#"><span>Impressum</span></a></li>
</ul>
</div>
</body>
</html>
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Darstellungsprobleme im IE7 und abwärts Matthias1982 CSS 1 08.05.2010 12:25
Kontaktformular Hilfe nötig :) sunny55 CSS 2 05.08.2008 20:29
HILFE, ich brauche Hilfe von Profis! frambuesa CSS 13 13.06.2008 23:46
Hilfe, Hilfe Layout zerschossen floody CSS 2 07.01.2006 17:46
Hilfe, Darstellungsprobleme unter Firefox zebra21 CSS 2 19.01.2005 17:18


Alle Zeitangaben in WEZ +2. Es ist jetzt 13:20 Uhr.