✔ Paar Probleme mit einer Seite

[Philipp-]

Hallo Liebe Community,

ich hab mal wieder ein paar Probleme mit einer Seite von mir.
Hab schon alles mögliche ausprobiert.

Die Livedemo gibt es hier: Livedemo!

Html Code auf Pastebin: Html Code auf Pastebin

Css Code auf Pastebin: Css Code auf Pastebin

So nun zu meinen Problemen:

1.Problem: Im Internetexplorer befinden sich im Contentbereich, sowie in der Navigation und Partner Box zwei, ich sage mal Leerstellen, wo ein Leerraum ist, der dort nicht sein sollte. Ich habe alles mögliche Versucht, jedoch bekomm ich diesen nicht weg. Hat jemand eine Idee wie ich diesen Wegbekomme?

Screenshot dazu:

Hier der Code dazu:

CSS:

.contentBox {
	width:630px;
	margin-top:14px;
	}
	
.contentBox ul li {
	margin:0;
	padding:0;
	list-style-image:none;
	list-style:none;
	}
	
.contentBox ul {
	margin:0;
	padding:0;
	}
	
.contentBox li {
	margin:0;
	padding:0;
	}

.contentTop  {
	background-image:url(images/contentTop.png);
	background-repeat:no-repeat;
	height:32px;
	width:630px;
	text-align:right;
	}
	
.contentMiddle  {
	background-image:url(images/contentMiddle.png);
	background-repeat:repeat-y;
	width:630px;
	font-family:Arial;
	font-size:11px;
	color:#636363;
	}
	
.content {
	width:582px;
	margin-left:24px;
	margin-right:24px;
	}
	
.contentBottom  {
	background-image:url(images/contentBottom.png);
	background-repeat:no-repeat;
	height:32px;
	width:630px;
	}

Html:

  <div class="contentBox">
   <ul>
    <li class="contentTop">
     <h5>Blindtext-Fall</h5>
    </li>
	<li class="contentMiddle">
	 <div class="content">
         </div>
        </li>
	<li class="contentBottom"></li>
   </ul>
  </div>

2.Problem: Die Links in der Navigation haben beim erstenmal noch einen Hovereffekt, und sobald man einmal draufgeklickt hat, ist dieser Weg, wie lässt sich das beheben:

Hier der Code dazu:

CSS:

.navContent a:link, a:active, a:visited {
	color:#9D9D9D;
	text-decoration:none;
	}
	
.navContent a:hover {
	color:#0BA6C4;
	text-decoration:underline;
	}

Wäre euch sehr dankbar, wenn ihr mir helfen könntet.

Mfg Philipp

 

[Maik]

Hi.

1. Problem: Notier nach dem Stylesheet einen Conditional Comment für den IE7, und ruf darin das folgende Stylesheet auf:

<link href="style.css" type="text/css" media="screen" rel="stylesheet" />
<!--[if IE 7]>
<style type="text/css">
li.contentMiddle, li.contentBottom, li.navMiddle, li.navBottom  { float:left; }
</style>
<![endif]-->

Das Stylesheet kann selbstverständlich auch in einer CSS-Datei ausgelagert werden.

2. Problem: Die korrekte Reihenfolge der Pseudoklassen unter Hinzunahme der Klasse, sowie das Entfernen der doppelt vorhandenen :visited-Pseudoklasse behebt selbiges:

.navContent a:link, .navContent a:visited, .navContent a:active {
        color:#9D9D9D;
        text-decoration:none;
        }

.navContent a:hover {
        color:#0BA6C4;
        text-decoration:underline;
        }

/*.navContent a:visited {
        color:#9D9D9D;
        text-decoration:none;
        }*/

Gleiches gilt im übrigen für die "Footer"-Links:

#footer a:link, #footer a:visited, #footer a:active {
        color:#FFFFFF;
        text-decoration:none;
        }

#footer a:hover {
        color:#FFFFFF;
        text-decoration:underline;
        }