mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Di 17.07.2018 21:20 Benutzername: Passwort: Auto-Login

Thema: CSS-Problem im IE7 vom 02.03.2007


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> CSS-Problem im IE7
Autor Nachricht
Ragnaroek
Account gelöscht Threadersteller


Ort: -

Verfasst Fr 02.03.2007 10:51
Titel

CSS-Problem im IE7

Antworten mit Zitat Zum Seitenanfang

Hallo allerseits.

Habe ein kleines Problem mit folgender Seite:

> h i e r <

Im FF siehst das ganez ok aus, im IE hingegen ist die rechte Spalte ab "Bestseller" nach unten verschoben.

Ich habe das Problem lokalilsieren können, finde aber keine Lösung. Es hat was mit der #col2_bestseller zu tun. Anscheinen wird das im FF von ersten div aus positioniert, im IE7 aber vom div davor anscheinend. IM IE6 habe ich das durch das *html beheben können, aber im IE7 finde ich keine Lösung...

Hier der html-Schnippsel:

Code:
<!-- #col2: zweite Flaot-Spalte des Inhaltsbereiches -->
<div id="col2">
   
   <div id="col2_content" class="clearfix">

      <form class="clearfix" action="#">
            
         Währung: &nbsp;
               
         <select name="waehrung" size="1" class="dropdown_waehrung">
            
            <option>US Dollar</option>
            <option>Euro</option>
         
         </select>
         
      </form>
      
      <div id="col2_nav_header">
      
         <ul>
            <li><a href="#">Liefer &amp; Versandkosten</a></li>
            <li><a href="#">Datenschutz</a></li>
            <li><a href="#">Unsere AGB</a></li>
            <li><a href="#">Impressum</a></li>
            <li><a href="#">Kontakt</a></li>
         </ul>

      </div>
      
      <div id="col2_bestseller">
      
         <h2>Bestseller</h2>
      
      </div>
      
      <div id="col2_nav_bestseller">
      
         <ul>
       
            <li><a href="#">Pooh Air Chair Set</a></li>
            <li><a href="#">Battleship</a></li>
            <li><a href="#">Line Control Car</a></li>
            <li><a href="#">Bright Slide Balls</a></li>
            <li><a href="#">Intex Winnie</a></li>
          
          </ul>
      
      </div>
      
      <div id="col2_bilder">
      
         <a href="#"><img src="images/weddingcars.jpg" alt="weddingcars" width="151" height="97" /></a><br />
         <a href="#"><img src="images/weddingflowers.jpg" alt="weddingflowers" width="151" height="98" /></a><br />
         <a href="#"><img src="images/moneyback.jpg" alt="moneyback" width="151" height="93"  /></a>   
      
      </div>
   
   </div>

</div>
   
<!-- #col2: - Ende -->


und das dazu gehörige css-Schnippsel:

Code:
/* Rechte Spalte */
#col2
{   

}

#col2 h2
{
   font-family: Arial, Helvetica, sans-serif;
   color: #8D4BAB;
   font-size: 1.4em;
   font-weight: bold;
   padding: 7px 0 0 10px;
}

*html #col2 h2
{
   padding: 7px 0 0 20px;
}

#col2_content
{
   padding-top: 1.5em;
   margin-left: 10px;
   list-style-image: url(../images/pfeil.gif);
}

*html #col2_content
{
   padding-top: 1.5em;
   margin-left: -2px;
   list-style-image: url(../images/pfeil.gif);
}

#col2_content ul
{
   width: 100px;
   padding-top: 4px;
}

#col2_content ul li
{
   width: 100px;
   padding-top: 5px;
}

#col2 form
{
   width: 151px;
   height: 25px;
   padding: 2px 0 0 0;
   margin: 5px 0 0 -12px;
   border-bottom: #C675A9 2px solid;
   float: left;
}

*html #col2 form
{
   margin: 0 0 0 0;
}

.dropdown_waehrung
{
   width: 80px;
}

#col2_nav_header
{
   width: 150px;
}

#col2_nav_header ul
{
   width: 150px;
   margin: 10px 0 0 -10px;   
   list-style-image: url(../images/pfeil.gif);
   float: left;
}

*html #col2_nav_header ul
{
   margin: 10px 0 0 0;
}

#col2_nav_header ul li
{
   width: 130px;
   border-bottom: #C4C4C4 1px dotted;
}

#col2_nav_header a
{
   color: #999999;
   text-decoration: none;
}

#col2_nav_header a:hover
{
   color: #C4C4C4;
}

#col2_bestseller
{
   background: #DDD1E4;
   width: 151px;
   height: 35px;
   border-top: 1px solid #C9B6D5;
   margin: 198px 0 0 -12px;
}

*html #col2_bestseller
{
   margin: 22px 0 0 -12px;
}

#col2_nav_bestseller
{
   width: 134px;
   margin: 10px 0 0 -20px;
}

*html #col2_nav_bestseller
{
   width: 190px;
   margin: 0px 0 0 -8px;
}

#col2_nav_bestseller ul
{
   padding-bottom: 10px;
   
}

*html #col2_nav_bestseller ul
{
   width: 190px;
}

#col2_nav_bestseller ul li
{
   list-style-image: none;
   list-style-type: disc;
}

*html #col2_nav_bestseller ul
{
   width: 190px;
}

#col2_nav_bestseller a
{
   color: #D23C9D;
   text-decoration:underline;
}

#col2_bilder
{
   margin: 0 0 0 -12px;
}


Wäre schön wenn sich das mal jemand anschauen könnte....

Besten dank schon mal

sagt artig

Ragna
 
m
Moderator

Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Fr 02.03.2007 12:17
Titel

Antworten mit Zitat Zum Seitenanfang

Ich habe mir das jetzt nicht weiter angesehen, aber wenn es gar nicht anders zu
lösen wäre, sind conditional comments eine mögliche Lösung.

Code:
<!--[if IE]>
   <link rel="stylesheet" type="text/css" href="iehacks.css" />
<![endif]-->
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
Ragnaroek
Account gelöscht Threadersteller


Ort: -

Verfasst Fr 02.03.2007 13:39
Titel

Antworten mit Zitat Zum Seitenanfang

habs jett so gelöst:

Code:
<!--[if lte IE 7]>
<link href="css/iehacks_1-3-2.css" rel="stylesheet" type="text/css" />
<link href="css/basemod_simple_ie7.css" rel="stylesheet" type="text/css" />
<![endif]-->


und so funzt es...danke für den Tip...wieder was gelernt...*zwinker*

Ragna


Zuletzt bearbeitet von am Fr 02.03.2007 14:28, insgesamt 1-mal bearbeitet
 
m
Moderator

Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Fr 02.03.2007 13:49
Titel

Antworten mit Zitat Zum Seitenanfang

Die bindest du vor der Browserweiche ganz normal ein.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Ragnaroek
Account gelöscht Threadersteller


Ort: -

Verfasst Fr 02.03.2007 14:13
Titel

Antworten mit Zitat Zum Seitenanfang

mmhh..und das funzt nicht so ganz...

ich verweise in der Weiche auf eine css-Datei die für den IE7 optimiert ist (basemod_simple_ie7). Vorher wird die basemod_simple geladen. Funzt anscheinend auch soweit...NUR...das was ich für den IE7 geändert habe wird auch im FF so dargestellt...

css:

Zitat:
<link href="css/layout.css" rel="stylesheet" type="text/css"/>

<![if lte IE 7]>
<link href="css/iehacks_1-3-2.css" rel="stylesheet" type="text/css" />
<link href="css/basemod_simple_ie7.css" rel="stylesheet" type="text/css" />
<![endif]


in der layout.css werden enige CSS-Dateien geladen und zusammengefasst...

danke

Ragna
 
 
Ähnliche Themen css > problem > ie6 +ie7 ..
IE7 margin Problem CSS
CSS: border-bottom beim a-tag: Problem mit IE7
Padding/Margin Problem zwischen FF und IE7 (html/css)
Klassiker, aber dringend: CSS im IE7
javascript-ie7-css-weiche
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.