Browserweiche?

webseite_freaky · #1 (**permalink**) 19.09.2008, 12:07

Hallo alle zusammen.

Ich habe eine Homepage, die nur richtig in Internt Explorer 6 angezeigt wird, im Internet Explorer 7 ist die Schrift dicker und im Mozilla Firefox ebenso. Nun würde ich gerne eine Browserweiche nutzen, sodass ich für:
Internet Explorer 6 <link rel="stylesheet" type="text/css" href="./template/style_ie.css" />

Internet Explorer 7 <link rel="stylesheet" type="text/css" href="./template/style_default.css" />

Mozilla Firefox <link rel="stylesheet" type="text/css" href="./template/style_ff.css" />

jeweils eine CSS Datei zugeornet wird. Es sollte auch nur so im Quelltext angezeigt werden. Ohne einem PHP Code. Weil ich will nicht meine ganze Seiten als PHP abspeichern. Ich sollte es in "index,de.htm" einbinden können, also eine HTM Datei!

Kennt jemand so eine Weiche? Ich danke euch schon einmal im Vorraus...

Liebe Grüße,
euer webseite_freaky

Boris · #2 (**permalink**) 19.09.2008, 12:09

Vielleicht solltest du einfach das Problem lösen anstelle jetzt Workarounds einzubauen. Zeig uns doch mal dein HTML und CSS!

webseite_freaky · #3 (**permalink**) 19.09.2008, 12:25

Zitat:

Zitat von Boris

Vielleicht solltest du einfach das Problem lösen anstelle jetzt Workarounds einzubauen. Zeig uns doch mal dein HTML und CSS!

Guten Morgen,

okay, hier ist erst mal der HTML Code:

Code:

<!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>
     <title>Irgendwas.de</title>
     <meta http-equiv="content-script-type" content="text/javascript" />
     <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
     <meta http-equiv="imagetoolbar" content="no" />
     <meta name="robots" content="all" />
     <meta name="description" lang="de" content="Willkommen auf irgendwas.de" xml:lang="de" />
     <meta name="description" lang="en" content="Welcome to something.de" xml:lang="en" />
     <meta name="keywords" content="welcome, to, something.de, willkommen, auf, irgendwas.de" />
     <meta name="verify-v1" content="----" />
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
     <link rel="stylesheet" type="text/css" href="./template/style_[BROWSER].css" />
   </head>
     <body>
       <div class="table">
        <table>
         <tr>
          <td>
           <h3>Willkommen auf irgendwas.de</h3>
            <p>Na, wie geht's euch denn so?</p>
          </td>
         </tr>
        </table>
       </div>
       
      <div class="header"><img src="./Webseitenbanner.gif" width="384" height="96" alt="JeMaine.de" /></div>
      <div class="side_image"><img src="./background_left.png" width="758" height="516" alt="" /></div>
   
      <div class="over_line"></div>      
      <div class="navigation">
       <div class="links">
         <br /><a href="./index,de.htm">Home</a>
         <br /><a href="./contact,de.htm">Kontakt</a>
         <br /><a href="./guestbook,de.htm">Gästebuch</a>
         <br /><a href="./gallery,de.htm">Gallery</a>
         <br /><a href="./movies,de.htm">Videos</a>
         <br /><a href="./chat,de.htm">Chat</a>
         <br /><a href="./forum,de.htm">Forum</a>
         <br /><a href="./disclaimer,de.htm">Disclaimer</a>
       </div>
      </div>
   
      <div class="movie_links">
        <br /><a href="./movies,de,1-17-Chop-Suey.htm">Chop Suey</a>
        <br /><a href="./movies,de,2-17-Channeld-in-your-heart.htm">Channeled in your heart</a>
        <br /><a href="./movies,de,3-17-Ring-my-bells.htm">Ring my bells</a>
        <br /><a href="./movies,de,4-17-Bounce.htm">Bounce</a>
        <br /><a href="./movies,de,5-17-New-High-Energy.htm">New High Energy</a>
        <br /><a href="./movies,de,6-17-Timbaland-Remix.htm">Timbaland Remix</a>
        <br /><a href="./movies,de,7-17-All-the-small-things.htm">All the small things</a>
        <br /><a href="./movies,de,8-17-Take-it-easy.htm">Take it easy</a>
        <br/><a href="./movies,de,9-17-Move-your-feet.htm">Move your feet</a>
        <br /><a href="./movies,de,10-17-Get-down.htm">Get down</a>
        <br /><a href="./movies,de,11-17-MAC-or-PC.htm">MAC or PC</a>
        <br /><a href="./movies,de,12-17-Total-Eclipse-of-the-heart.htm">Total Eclipse of the heart</a>
        <br /><a href="./movies,de,13-17-Funky-town.htm">Funky town</a>
        <br /><a href="./movies,de,14-17-Black-to-jail.htm">Black to jail</a>
        <br /><a href="./movies,de,15-17-Paint-it-black.htm">Paint it black</a>
        <br /><a href="./movies,de,16-17-Snow-Hey-Oh!.htm">Snow-Hey Oh!</a>
        <br /><a href="./movies,de,17-17-Dirty.htm">Dirty</a>
      </div>
  
      <div class="copyright"><a>copyright by irgendwas.de 2008</a></div>
      <div class="verwaltung"><a href="./login,de.htm">Verwaltung</a></div>
  
      <div class="adsense">
       <!-- x-adservice.com start -->
        <script type="text/javascript"><!--
         xads_webmaster = "33003159";
         xads_promotion = "";
         xads_category = "0";
         xads_family = "1";
         xads_adult_start = "";
         xads_adult_end = "";
         xads_text_rows = "4";
         xads_text_cols = "1";
         xads_text_format = "6";
         xads_text_width = "180";
         xads_text_height = "600";
         xads_text_type = "1";
         xads_color_border = "F5FFFA";
         xads_color_background = "E9F8FB";
         xads_color_title = "CC99FF";
         xads_color_text = "000000";
         xads_color_url = "CCCCCC";
         //--></script>
        <script type="text/javascript" src="http://ads.x-adservice.com/text.php"></script>
       <!-- x-adservice.com end -->
      </div>
     </body>
</html>

Und jetzt die CSS Datei:

Code:

html {
  height: 100%;
}
  body {
  height: 100%;
  display: block;
  margin: 0px;
  padding: 0px;
  border-spacing: 0px;
  padding: 0px;
  background-color: #F5FFFA;
  color: black;
  font-size:14px;
  font-family: Verdana;
}
  div.header {
  position: absolute;
  top: 0px;
  left: 429px;
  z-index: 90;
}
  .background_image {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 20cm;
  height: 500px;
  vertical-align: bottom;
  z-index:1;
}
  div.table {
  position: absolute;
  top: 105px;
  left: 188px;
  width: 627px;
    background-color: #D6CFE6;  
	opacity: 0.85;
  -moz-opacity: 0.85;
  -khtml-opacity: 0.85;
	filter: alpha(opacity=85);
  font-weight: bold;
  z-index:35; 
}
  div.clip_header {
  position: absolute;
  top: 125px;
  left: 188px;
  width: 18cm;
  z-index:35;
  font-weight: bold;
}
  div.links{
  position: absolute;
  top: 0px;
  left: 16px;
  height: 20px;
  widht: 10px;
  font-size: 15px;
}
  div.movie_links {
  position: absolute;
  top: 135px;
  left: 650px;
  z-index: 35;
} 
  div.clip_bar {
  position: absolute;
  top: 150px;
  left: 188px;
  z-index: 35;
}
  .navigation {
  position: absolute;
  top: 105px;
  left: 4px;
  width: 175px;
  height: 430px;
	opacity: 0.5;
  -moz-opacity: 0.5;
  -khtml-opacity: 0.5;
	filter: alpha(opacity=50);
  background-color: #75316e;
  z-index:60;
}
  div.copyright{
  position: absolute;
  top: 80px;
  left: 15px;
  width: 220px;
  font-size: 12px;
  z-index: 250;
  color:#000000; 
  text-decoration:none;
}
  div.adsense {
  position: absolute;
  top: 104px;
  left: 825px;
  opacity: 0.8;
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
	filter: alpha(opacity=80);
  z-index: 91;
}
.over_line {
  position: absolute;
  top: 65px;
  left: 4px;
  width: 11cm;
  height: 30px;
	opacity: 0.5;
  -moz-opacity: 0.5;
  -khtml-opacity: 0.5;
	filter: alpha(opacity=50);
  background-color: #75316e;
  z-index:60;
}
div.verwaltung {
  position: absolute;
  top: 65px;
  left: 15px;
  width: 50px;
  text-align: right;
  font-size:10px;
  z-index:95;
}
td.cth-t {
  position: relative;
  width: 60px;
  font-size: 15px;
  vertical-align: top;
}

td.cth-p {
  position: relative;
  width: 35px;
}

.cth-i {
  position: relative;
  width: 465px;
  z-index: 300;

}
img.pic {
  border: 0px;
}
form {
margin-top: 0px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
margin: 0px;
}

input, textarea, select {
font-family: arial,helvetica,sans-serif;
font-size: 10pt
}

body, td {
font-family: arial,helvetica,sans-serif;
font-size:10pt;
color: #000000;
}

#red {}
#grey {}



#guestbooktable {background: #D6CFE6}

#guestbooktitle {
font-family: arial,helvetica,sans-serif;
font-size: 10pt;
font-weight: bold;
background: #D6CFE6;
vertical-align: top;
}

#guestbooktitleinfo {
font-family: tahoma,arial,helvetica,sans-serif;
font-size: 8pt;
color:#D6CFE6;
vertical-align: middle
}

#guestbookcell {
font-family: arial,helvetica,sans-serif;
font-size: 9pt;
background:;
vertical-align: top;
}

#guestbookinfo {
font-family: tahoma,arial,helvetica,sans-serif;
font-size: 10pt;
color: #000000;
background: #D6CFE6;
vertical-align: center
}

#guestbookinfolight {
font-family:tahoma,arial,helvetica,sans-serif;
font-size:8pt;
color:#000000;
background: #C8BDFB;
vertical-align:underline;
}

#table {
border:0px;
}

#spacing {
cellspacing:0px;
}


a:link { color:#000000; text-decoration:none; }
a:visited { color:#000000; text-decoration:none; }
a:hover { color:#000000; text-decoration:underline; }
span.visit *:visited { color:#000000; text-decoration:none }
}

Entschuldigung, das ich die CSS Datei hier als HTML einbinde, ging aber leider nicht anders...

Liebe Grüße,
euer webseite_freaky

Crizzo · #4 (**permalink**) 19.09.2008, 12:47

Beschreibst du uns dein Problem auch? Welcher Browser stellt was nicht wie gewollt dar?

PS: Du hast Fehler im CSS, nicht alle Fehler liegen an "-moz" und CSS3 Eigenschaften.

Boris · #5 (**permalink**) 19.09.2008, 12:48

Zitat:

Zitat von BlackHawk

Beschreibst du uns dein Problem auch? Welcher Browser stellt was nicht wie gewollt dar?

Steht doch oben: "... im Internet Explorer 7 ist die Schrift dicker und im Mozilla Firefox ebenso..."

Zum Problem - du hast alle Schriftgrößen in pt angegeben, das eignet sich aber nur ausschließlich für den Druck. Nutze hier px oder besser em.

Das gleiche gilt für alle Breitenangeben - hier ist px, % oder em sinnvoll, aber nicht cm!

webseite_freaky · #6 (**permalink**) 19.09.2008, 12:48

Zitat:

Zitat von BlackHawk

Beschreibst du uns dein Problem auch? Welcher Browser stellt was nicht wie gewollt dar?

Hallo,

mein Problem ist: Der Mozilla Firefox und der Microsoft Internet Explorer 7 stellen die Schrift anders da und die Abstände.

Liebe Grüße,
euer webseite_freaky

Crizzo · #7 (**permalink**) 19.09.2008, 12:50

Zitat:

Zitat von webseite_freaky

Hallo,

mein Problem ist: Der Mozilla Firefox und der Microsoft Internet Explorer 7 stellen die Schrift anders da und die Abstände.

@Abstände: [faq]CSS-Prolog[/faq]
@Schrift: siehe Boris

webseite_freaky · #8 (**permalink**) 19.09.2008, 12:53

Zitat:

Zitat von Boris

Steht doch oben: "... im Internet Explorer 7 ist die Schrift dicker und im Mozilla Firefox ebenso..."

Zum Problem - du hast alle Schriftgrößen in pt angegeben, das eignet sich aber nur ausschließlich für den Druck. Nutze hier px oder besser em.

Das gleiche gilt für alle Breitenangeben - hier ist px, % oder em sinnvoll, aber nicht cm!

Hallo.

Ich nutze nirgendwas "pt" außer bei den Eingaberfelder (input)

Daran wird es ja wohl kaum liegen...

Liebe Grüße,
euer webseite_freaky

Crizzo · #9 (**permalink**) 19.09.2008, 12:56

Zitat:

Zitat von webseite_freaky

Hallo.

Ich nutze nirgendwas "pt" außer bei den Eingaberfelder (input)

Daran wird es ja wohl kaum liegen...

Liebe Grüße,
euer webseite_freaky

Es wird schwierig, dir zu helfen, wenn du die Vorschläge nicht einfach mal umsetzt...

Boris · #10 (**permalink**) 19.09.2008, 12:58

Selbst für Inputs ist es falsch - und lies mein Kommentar zu deinen Breitenangaben.

Kann man dein Problem irgendwo sehen mit der Schriftgröße? Oder kannst du Screenshots machen?

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
CSS für Firefox, IE, Opera Probleme - Browserweiche	talkuvit	CSS	4	31.10.2009 18:07
Browserweiche in PHP	HittiSan	Serveradministration und serverseitige Scripte	12	30.01.2009 11:19
browserweiche - ie	gudrun	CSS	4	22.10.2006 14:25
Suche Browserweiche: Coditional Comments für Firefox?	braindead	(X)HTML	14	15.09.2006 18:22