mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Fr 29.03.2024 15:46 Benutzername: Passwort: Auto-Login

Thema: CSS-Problem im IE vom 15.12.2009


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> CSS-Problem im IE
Seite: 1, 2  Weiter
Autor Nachricht
Aerendil
Threadersteller

Dabei seit: 28.11.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst Di 15.12.2009 12:00
Titel

CSS-Problem im IE

Antworten mit Zitat Zum Seitenanfang

Tach zusammen - ich bin gerade am umsteigen von altgedienten Tabellen auf CSS mit wie zu erwartenden Hindernissen.
Das Problem dass bei mir auftaucht hat wahrscheinlich mit dem Box-Model-Hack zu tun, bin mir aber nicht sicher.

Das Problem betrifft ein div (Textteil) und die Positionierung dessen in einem anderen Div (maincontent) in jedem normalen Browser dieser Welt wir der Text auf der Höhe der Bildplatzhalter rechts angezeigt, außer im IE, der nagelt den Text direkt an die Kante des Maincontent-divs. Was mich jedoch stutzig macht, ist die Tatsache das das Div mit den Bildern (bildteil) richtig positioniert wird...

Also wer eine Ahnung hat woran das liegt oder wie ich das beheben kann, immer her damit.

Liveansicht hier: http://www.haag-marketing.de/temp/test2.html

Code html:

Code:
<!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=UTF-8" />
<title>Test</title>
<link rel="stylesheet" href="CCS2.css" type="text/css" />

</head>

<body class="oneColElsCtrHdr">

<div id="container">
  <div id="header">
  </div>
  <div id="mainContent">
 
     <div id_="textteil" class="textteil">
       <h1>Headline</h1>
        <p><span class="normal">Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen. Manchmal benutzt man Worte wie Hamburgefonts, Rafgenduks oder Handgloves, um Schriften zu testen. Manchmal Sätze, die alle Buchstaben des Alphabets enthalten - man nennt diese Sätze »Pangrams«. Sehr bekannt ist dieser: The quick brown fox jumps over the lazy old dog. Oft werden in Typoblindtexte auch fremdsprachige Satzteile eingebaut (AVAIL® and Wefox™ are testing aussi la Kerning), um die Wirkung in anderen Sprachen zu testen. In Lateinisch sieht zum Beispiel fast jede Schrift gut aus. Quod errat demonstrandum. Seit 1975 fehlen in den meisten Testtexten die Zahlen, weswegen nach TypoGb. 204 § ab dem Jahr 2034 Zahlen in 86 der Texte zur Pflicht werden. Nichteinhaltung wird mit bis zu 245 € oder 368 $ bestraft. Genauso wichtig in sind mittlerweile auch Âçcèñtë, die in neueren Schriften aber fast immer enthalten sind. Ein wichtiges aber schwierig zu integrierendes Feld sind OpenType-Funktionalitäten. Je nach Software und Voreinstellungen können eingebaute Kapitälchen, Kerning oder Ligaturen (sehr pfiffig) nicht richtig dargestellt werden. Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen. Manchmal benutzt man Worte wie Hamburgefonts, Rafgenduks<br />
        </span><br />
          <br />
        </p>
</div>
<div id_="bildteil" class="bildteil">
       
              <img src="null.gif" alt="" width="105" height="70" border="0" /><br />
              <br />
              <img src="null.gif" alt="" width="105" height="70" border="0" /><br />
              <br />
              <img src="null.gif" alt="" width="105" height="70" border="0" /><br />
   </div>
</div><!-- end #mainContent -->

<div class="clear"></div>
   
  <div id="footer">
    <span><a href="#" onclick="MM_openBrWindow('#','','width=520,height=500')">Freunde einladen &gt;&gt;</a></span>
    <!-- end #footer -->
  </div>
 
<!-- end #container --></div>
</body>
</html>


CSS:

Code:
@charset "UTF-8";
/* CSS Document */


body,td,th {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 14px;
   color: #000000;
}
body {
   font: 100.01% Arial, Helvetica, sans-serif;
   background: #000000;
   margin: 0;
   padding: 0;
   text-align: center;
   color: #000000;
}
.oneColElsCtrHdr #container {
   width: 59.5em; 
   background: #FFFFFF;
   margin: 0 auto;
   border: none;
   text-align: left;
}
.oneColElsCtrHdr #header {
   background: #000000;
   padding: 20px 0px 0px 0px;
   height: 17em;
}
.oneColElsCtrHdr #mainContent {
   padding: 0 20px;
   background: #FFFFFF;
}
.textteil {
   padding: 0px 0px;
   float:left;
   width: 785px;
}

.bildteil {
   padding: 20px 0px;
   float:right;
   width: 105px;
}
.clear {
clear:left;
}

.oneColElsCtrHdr #footer {
   padding: 10px 20px;
   background:#ffffff;
}
a {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 14px;
   color: #FF00FF;
   text-decoration:none;
}
a:hover {
   color: #00FF33;
}
h1 {
   font-size: 20px;
   color: #000000;
}
h2 {
   font-size: 16px;
}
.rosa {
   color: #FF00FF;
}

.normal {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 14px;
   color: #000000;
   text-decoration:none;
}
  View user's profile Private Nachricht senden
heiko_rs

Dabei seit: 06.02.2008
Ort: Berlin
Alter: -
Geschlecht: Männlich
Verfasst Di 15.12.2009 12:28
Titel

Antworten mit Zitat Zum Seitenanfang

Als erstes default-Abstände zurücksetzen: http://fwpf-webdesign.de/css/arten-von-selektoren/universalselektor
Dann validieren: http://validator.w3.org/
Dann wieder melden *zwinker*
  View user's profile Private Nachricht senden
Anzeige
Anzeige
dcn

Dabei seit: 20.08.2008
Ort: -
Alter: 43
Geschlecht: Männlich
Verfasst Di 15.12.2009 12:30
Titel

Antworten mit Zitat Zum Seitenanfang

...und mal
Zitat:
div id_="bildteil"
in div id="bildteil" ändern.
  View user's profile Private Nachricht senden
heiko_rs

Dabei seit: 06.02.2008
Ort: Berlin
Alter: -
Geschlecht: Männlich
Verfasst Di 15.12.2009 12:33
Titel

Antworten mit Zitat Zum Seitenanfang

Genau deswegen mein Hinweis auf den Validator, der sowas nämlich bemängelt.
  View user's profile Private Nachricht senden
Aerendil
Threadersteller

Dabei seit: 28.11.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst Di 15.12.2009 12:37
Titel

Antworten mit Zitat Zum Seitenanfang

Hi, danke (mal wieder) für deine Hilfe

also der Validator spuckt das aus:

1. Error Line 18, Column 13: Attribute "id_" is not a valid attribute. Did you mean "width" or "datetime"?

<div id_="textteil" class="textteil">


You have used the attribute named above in your document, but the document type you are using does not support that attribute for this element. This error is often caused by incorrect use of the "Strict" document type with a document that uses frames (e.g. you must use the "Transitional" document type to get the "target" attribute), or by using vendor proprietary extensions such as "marginheight" (this is usually fixed by using CSS to achieve the desired effect instead).

This error may also result if the element itself is not supported in the document type you are using, as an undefined element will have no supported attributes; in this case, see the element-undefined error message for further information.

How to fix: check the spelling and case of the element and attribute, (Remember XHTML is all lower-case) and/or check that they are both allowed in the chosen document type, and/or use CSS instead of this attribute. If you received this error when using the <embed> element to incorporate flash media in a Web page, see the FAQ item on valid flash.
  View user's profile Private Nachricht senden
heiko_rs

Dabei seit: 06.02.2008
Ort: Berlin
Alter: -
Geschlecht: Männlich
Verfasst Di 15.12.2009 12:45
Titel

Antworten mit Zitat Zum Seitenanfang

Aerendil hat geschrieben:
also der Validator spuckt das aus:

1. Error Line 18, Column 13: Attribute "id_" is not a valid attribute.

Genau, und was an "id_" falsch ist, dürfte Dir klar sein, hoffe ich *zwinker*


Zuletzt bearbeitet von heiko_rs am Di 15.12.2009 12:46, insgesamt 2-mal bearbeitet
  View user's profile Private Nachricht senden
Aerendil
Threadersteller

Dabei seit: 28.11.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst Di 15.12.2009 13:30
Titel

Antworten mit Zitat Zum Seitenanfang

* Ich geb auf... *

Da gibt es so ein Sprichwort mit Wald und Bäumen und so...

Danke! - also manchmal hat man so Tage.
  View user's profile Private Nachricht senden
Aerendil
Threadersteller

Dabei seit: 28.11.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst Di 15.12.2009 13:45
Titel

Antworten mit Zitat Zum Seitenanfang

Argh! das Problem besteht aber nach wie vor... *Schnief*

Code:
.oneColElsCtrHdr #mainContent {
   padding: 0 20px;
   background: #FFFFFF;
}
.textteil {
   padding: 0px 0px;
   float:left;
   width: 785px;
}


und wenn ich im teixtteil das padding auch auf 20Px stelle, wird es zwar im IE richtig angezeigt, aber im Firefox dafür ein Stück weit zu tief...

*hu hu huu*


Zuletzt bearbeitet von Aerendil am Di 15.12.2009 13:48, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
 
Ähnliche Themen Formmailer-Problem-neues problem
CSS Problem (IE)
PS Problem
Problem mit Ton
Css problem
Problem mit div
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2  Weiter
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.