zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Problem Browserweiche IE CSS

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 23.09.2010, 14:19
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 23.09.2010
Beiträge: 2
00001 befindet sich auf einem aufstrebenden Ast
Standard Problem Browserweiche IE CSS

Servus,

mal schauen wie ich mein Problem erklären kann...

Ich arbeite gerade an einem Template und arbeite da mit rounded corners im CSS. Klappt ja natürlich mit Opera, Firefox, IE9 etc. alles super. Alles unter IE9 unterstützt das ganze ja nicht und mit .htc "Hacks" möchte ich eigtl nicht arbeiten.

Für die älteren Versionen hab ich dann eine Browserweiche gemacht die dann auf eine CSS Datei speziell IE lte 8 verlinkt ist um da Grafiken für die Ecken zu nehmen.

Mein Problem ist jetzt das ich nicht genau weiß was ich jetzt in welches CSS schreiben... Eigtl war ich mir sicher das es schon mal ein Schritt in die richtige Richtung ist... aber war es nicht!

Das ist meine xhtml datei... so hoffe ich doch

Code:
<?xml version="1.0" encoding="windows-1252"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"/>
        <link rel="stylesheet" href="css/xxxx.css" type="text/css"/>
        <!--[if lte IE 8]><link rel="stylesheet" href="css/ie.css" type="text/css"/><![endif]-->
        <title>xxx.xxx</title>
    </head>
    <body>
      <div id="whitebox">
       <div id="header">
         <div id="logo"><a href="index.php"><img src="http://xhtmlforum.de/images/logo.png" border="0" alt="Home" /></a>
         </div>
         <div id="menu">
         </div>
       </div>
       <div id ="greybox">
        <span class="greybox-top-right"></span>
        <span class="greybox-bottom-left"></span>
        <span class="greybox-bottom-right"></span>
        </div>
        <div id="main">
         <div id="contentbox">
          <div id="content">
          </div>
         </div>
        </div>
    
       <div id="footer">
       </div>
      </div>
    </body>
</html>

Hier meine eigtl CSS Datei

Code:
body {
  background-image:url(../images/bg.jpg);
  background-color:#efefef;
  background-repeat:no-repeat;
  font-size: 11px;
  font-family: Verdana, Helvetica;
  color:#000000;
  padding:0px;
  margin:0px;
}
a {
  color:#dddddd;
  text-decoration:none;
}
#whitebox {
  background-image:url(../images/wbg.png);
  position:absolute;
  width:900px;
  height:100%;
  left: 50%;
  margin-left:-450px;
}

#header {
  position:relative;
  height:150px;
  width:900px;
  margin:0;
  padding:0;
}

#logo {
  position:relative;
  float:left;
  height:117px;
  width:416px;
  margin:10px 0px 0 10px;
}

#menu {
  position:relative;
  height:120px;
  width:160px;
}
#greybox {
  background-color:#dddddd;
  position:absolute;
  width:750px;
  height:520px;
  left: 50%;
  margin: 30px 0 0 -375px;
  -moz-border-radius:20px;
  -webkit-border-radius:20px;
  -khtml-border-radius:20px;
  border-radius:20px;
  box-shadow:8px 8px 6px #777;
  -moz-box-shadow:8px 8px 6px #777;
  -webkit-box-shadow:8px 8px 6px #777;
  -khtml-box-shadow:8px 8px 6px #777;

}

#main {
  position:relative;
  float:left;
  width:740px;
  margin:0px 0px 0px 0px;
  padding:0;
}
#contentbox {
  position:relative;
  float:left;
  width:700px;
  margin:0px 0px 0px 0px;
  padding:0;
}
#footer {
  position:relative;
  width:700px;
  height:50px;
}

und die IE lte 8 Ergänzung

Code:
#greybox {
  background-image:url(../images/rcol.png) no-repeat;
  background-color:#dddddd;
  position:relative;
  width:750px;
  height:520px;
  top: 50%;
  left: 50%;
  margin: -230px 0 0 -750px;
  padding: 20px;
}

span.greybox-top-right, span.greybox-bottom-left, span.greybox-bottom-right {
position: absolute;
width: 20px;
height: 20px;
display: block;
}

span.greybox-top-right {
background: url(../images/rcor.png) no-repeat;
top: 0;
right: 0;
}
span.greybox-bottom-left {
background: url(../images/images/rcul.png) no-repeat;
bottom: 0;
left: 0;
}
span.greybox-bottom-right {
background: url(../images/rcur.png) no-repeat;
bottom: 0;
right: 0;
}
Ich will da halt "nur" die "Greybox" tauschen...

Wer sich das bis hier schon durchgelesen hat... besten dank!

Geändert von 00001 (23.09.2010 um 14:24 Uhr)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 23.09.2010, 14:26
Benutzerbild von jnv
jnv jnv ist offline
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 07.07.2010
Beiträge: 152
jnv befindet sich auf einem aufstrebenden Ast
Standard

Aus trotz sollte man das so machen:

Code:
<!--[if  IE]>
<style type="text/css">
body {display: none};
</style>/><![endif]-->



Benutz doch einfach gleich für alle Browser die Grafiken dann sparst du dir so ein rumgefummel. Ich persönlich mache das so, denn sowas tu ich mir nicht an
__________________
#m { f : g } /* jnv */

Geändert von jnv (23.09.2010 um 14:37 Uhr)
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 23.09.2010, 14:28
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 16.09.2009
Beiträge: 601
Muamicus wird schon bald berühmt werden
Standard

Schreibe doch die runden ecken gleich einmal für alle browser. Also weise überall die ecken als img zu. Denn auch ältere Safari etc könnend as nicht. So machste es einmal @all und good is ^^
Mit Zitat antworten
  #4 (permalink)  
Alt 23.09.2010, 15:12
Benutzerbild von Praktikant
Semantikbremse.
XHTMLforum-Kenner
 
Registriert seit: 22.04.2008
Beiträge: 4.989
Praktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz sein
Standard

Durch die xml-Deklaration vor dem Doctype dürfte der IE sowieso im Quirksmodus sein. Nimm die am besten raus, der IE kann sie eh nicht.

Die Grafiken kannst du entweder für alle Browser einsetzen oder nur für den IE (IE-Stylesheet). Wenn du keine Bilder lädst, dann lädt die Seite halt schneller.
__________________
Rettet die Erde.... sie ist der einzige Planet mit Schokolade!
Mit Zitat antworten
  #5 (permalink)  
Alt 24.09.2010, 08:30
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 23.09.2010
Beiträge: 2
00001 befindet sich auf einem aufstrebenden Ast
Standard

@jnv & nils_1309
das es so geht ist mir auch klar. ist abe rhalt nicht das was ich will

@praktikant
das mit dem quirksmodus ist ein guter tipp.


nur wie sollte ich dem ie mitteilen das er den entsprechenden teil aus seinem css nimmt und nicht aus dem allgemeinen?

denn es kommt mir vor als ob die allg. css datei die vom ie "überschreibt"...
Mit Zitat antworten
  #6 (permalink)  
Alt 24.09.2010, 10:23
Benutzerbild von Praktikant
Semantikbremse.
XHTMLforum-Kenner
 
Registriert seit: 22.04.2008
Beiträge: 4.989
Praktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz sein
Standard

Die Datei muss nur aufgerufen werden (nach dem normalen Stylesheet) und dann müssen alle relevanten Werte (mit selber oder höherer Wichtigkeit) überschrieben werden.

Funktioniert sicherlich so wie du es machst.
__________________
Rettet die Erde.... sie ist der einzige Planet mit Schokolade!
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
Einbindung von frei erhältlichen Scripten - CSS Problem DonL CSS 1 22.01.2011 16:09
Problem beim ein/ausblenden von Spalten in Tabellen via CSS und JavaScript chrisol_76 CSS 2 21.07.2008 17:37
Css und Steam Problem justinlenz Offtopic 3 27.03.2008 21:58
CSS Problem Adriana CSS 0 09.09.2006 16:51
CSS Tips & Tricks Webnauts Ressourcen 0 25.08.2006 23:04


Alle Zeitangaben in WEZ +2. Es ist jetzt 05:16 Uhr.