zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden IE Problem: h3 mehr abstand links

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 03.04.2005, 23:09
i like to move it
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 06.03.2005
Ort: Freiburg
Beiträge: 205
^uncool befindet sich auf einem aufstrebenden Ast
Standard IE Problem: h3 mehr abstand links

Nabend Community
Ich habe mal ein klitzekleines Problem im IE (5.x und 6)

Problem:
Im Contenteil habe ich eine Überschrift und eine

-Box, die untereinander so angelegt wurden, dass sie wie eine kleine Tabelle aussehen mit 2 Zeieln und jeweils 1 Spalte sozusagen.
Im IE auf der Höhe des Menus tritt ein komischer Fehler auf:
Die P-Box fängt ca. 2px zu weit rechts an (siehe Link).
Ich müsste der Überschrift eine Größenangabe zuweisen, damit das normal klappt, jedoch würde ich gerne wissen, wieso das zusande kommt?

Link zum Problem
Danke für die Hilfe
__________________
>> Linux is like a wigwam: no windows, no Gates, Apache inside. <<
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 04.04.2005, 16:19
{ display: random;}
XHTMLforum-Kenner
 
Registriert seit: 08.09.2004
Ort: Stuttgart
Beiträge: 5.034
andir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblick
Standard

Bin ja nicht der erste, der hier reinschaut und nicht der erste, der keine Lösung für dieses seltsame Verhalten weiß obwohl ich ziemlich lange daran rumgemacht habe.)

Poste trotzdem mal, damit du weißt, dass dieser Thread nicht vergebens ist.
Das Problem betrifft ja nur das erste Auftauchen von p im #inhalt, alle anderen ( habe welche hinzugefügt) zeigen dieses Verhalten nicht.

Was meinst Du mit Überschrift Größenangabe, damit das klappt??
Width? Habe probeweise p mal eine width ( 518px nach meiner Rechnung) mitgegeben, der FF zeigts richtig an, beim IE hats nix verändert, was den Einzug angeht, dafür springt p nach unten und das erste h3 wird erst beim Überfahren sichtbar.... probiers aus. Sehr merkwürdig, das.

Vielleicht hilft Dir ( oder jemand anderen) das weiter.

grüsse andir
__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 04.04.2005, 16:23
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 02.06.2003
Beiträge: 2.441
ulle befindet sich auf einem aufstrebenden Ast
Standard

Einfach mal ge"pell"t den CODE posten
siehe wie hier http://www.xhtmlforum.de/viewtopic.php?t=1399

Und nur die Stellen die es betrifft, dabei wird es sich lösen.......
__________________
</ulle>
Mit Zitat antworten
  #4 (permalink)  
Alt 04.04.2005, 17:05
i like to move it
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 06.03.2005
Ort: Freiburg
Beiträge: 205
^uncool befindet sich auf einem aufstrebenden Ast
Standard

Vielen Dank andir, ist nett von dir
Das "Problem" tritt nur auf der Höhe des Menus auf, wenn man den Inahlt des Menus erweitert, sind auch die restlichen Boxen davon betroffen
@ulle: sorry, wusste ich nicht:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

<style type="text/css">
*	{margin:0; padding:0; border:none}

body,
html			{height:100%; text-align:center}
div				{text-align:left; font:.9em Verdana, Arial, sans-serif; color:#fff}

h1				{font-size:1.1em; color:black}
h3				{font-size:.97em; color:red; background:#EEE; border:1px solid #000; border-bottom:none !important; line-height:25px}


div#container	{width:700px; margin:0 auto; background:#900}
div#kopf		{height:100px; background:black}
div#menu		{float:left; width:140px}
div#inhalt		{background:#FFF; margin-left:160px; padding:10px}

p.box {background:#666; border:1px solid #000; height:90px; padding-top:5px; margin-bottom:20px}
</style>

<title>Beispieldatei</title>
</head>
<body>
<div id="container">
<div id="kopf">Header</div>
<div id="menu">


Menu</p>


Menu</p>


Menu</p>


Menu</p>


Menu</p>


Menu</p>
</div>
<div id="inhalt">
<h1>Fehler im IE</h1>
<h3>Box A</h3>
<p class="box">
Ganz unauffällig konnte ich so Deine schlanken Ober- und Unterlängen studieren und den Anblick Deiner zierlichen Füsschen und Serifen geniessen.Nach einer gewissen Laufweite fasste ich mir ein Herz, Dich zueinem Zwiebelfisch-Imbiss einzuladen.
</p>
<h3>Box B</h3>
<p class="box">
Ganz unauffällig konnte ich so Deine schlanken Ober- und Unterlängen studieren und den Anblick Deiner zierlichen Füsschen und Serifen geniessen.Nach einer gewissen Laufweite fasste ich mir ein Herz, Dich zu einem Zwiebelfisch-Imbiss einzuladen.
</p>
</div>
</body>
</html>
__________________
>> Linux is like a wigwam: no windows, no Gates, Apache inside. <<
Mit Zitat antworten
  #5 (permalink)  
Alt 04.04.2005, 18:59
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Ich habe mal in deinem Quelltext gespielt; wenn du die Inhalts-Box auch floatest, tritt der Fehler nicht mehr auf. Warum das so ist? Frag M$
An diesen Bug hattte ich zuerst gedacht; der Fix blieb aber wirkungslos.

Die padding-/und margin-Werte hab' ich anders verteilt, damit's auch im IE5 passt.
Getestet habe ich in FF, IE 5.0, 5.5, 6, Opera 6+7, alles WinXP SP1

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

<style type="text/css">
*   {margin:0;
	padding:0;
	border:none}

body, html {height:100%;
	text-align:center;
	background-color:#fff;
	color:#000;}

div	{text-align:left;
	font:.9em Verdana, Arial, sans-serif;
	color:#fff;}

h1	{font-size:1.1em;
	color:black;}

h3	{font-size:.97em;
	color:red; 
	background:#EEE; 
	border:1px solid #000; 
	border-bottom:none !important; 
	line-height:25px;}


#container	{width:700px; 
	margin:0 auto; 
	background:#900;}

#kopf	{height:100px;
	background:black;}

#menu	{float:left; 
	width:140px;}

#inhalt	{background:#FFF; 
	/*margin-left:160px;*/
	float:right;
	width:540px;
	padding:10px 0;}

#inhalt h1, #inhalt h3, #inhalt p {margin-left:10px; margin-right:10px;}

.box {background:#666; 
	border:1px solid #000; 
	height:90px; 
	padding-top:5px; 
	margin-bottom:20px;}

.clear {clear:both;}

</style>

<title>Beispieldatei</title>
</head>
<body>
	<div id="container">
		<div id="kopf">Header</div>
		<div id="menu">
			

Menu</p>
			

Menu</p>
			

Menu</p>
			

Menu</p>
			

Menu</p>
			

Menu</p>
		</div>
		<div id="inhalt">
			<h1>Fehler im IE</h1>
			<h3>Box A</h3>
			<p class="box">Ganz unauffällig konnte ich so Deine schlanken Ober- und Unterlängen studieren und den Anblick Deiner zierlichen Füsschen und Serifen geniessen.Nach einer gewissen Laufweite fasste ich mir ein Herz, Dich zueinem Zwiebelfisch-Imbiss einzuladen.
			</p>
			<h3>Box B</h3>
			<p class="box">Ganz unauffällig konnte ich so Deine schlanken Ober- und Unterlängen studieren und den Anblick Deiner zierlichen Füsschen und Serifen geniessen.Nach einer gewissen Laufweite fasste ich mir ein Herz, Dich zu einem Zwiebelfisch-Imbiss einzuladen.
			</p>
		</div>
		<br class="clear">
	</div>
</body>
</html>
BTW: Du hast ein div vergessen zu schließen.

Grüße
fricca
Mit Zitat antworten
  #6 (permalink)  
Alt 04.04.2005, 19:31
i like to move it
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 06.03.2005
Ort: Freiburg
Beiträge: 205
^uncool befindet sich auf einem aufstrebenden Ast
Standard

Sehr schön, vielen Dank
Die Bugs bin ich auch schon rauf und runter gegangen
__________________
>> Linux is like a wigwam: no windows, no Gates, Apache inside. <<
Mit Zitat antworten
  #7 (permalink)  
Alt 04.04.2005, 22:29
{ display: random;}
XHTMLforum-Kenner
 
Registriert seit: 08.09.2004
Ort: Stuttgart
Beiträge: 5.034
andir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblick
Standard

Jo, das fehlende /div hatte ich beim validieren lassen auch gesehen, aber einer Problemlösung bin ich dadurch nicht nähergekommen.
Der Code war ja nun auch einfach genug.

So wie friccas Lösung das angeht, gehts natürlich.

Eine Erklärung für das seltsame Verhalten des IE gibts aber immer noch nicht.
Hm.

grüsse andir
__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte
Mit Zitat antworten
  #8 (permalink)  
Alt 04.04.2005, 22:41
i like to move it
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 06.03.2005
Ort: Freiburg
Beiträge: 205
^uncool befindet sich auf einem aufstrebenden Ast
Standard

Ich habe es mir schon länger abgewöhnt den IE zu verstehen
__________________
>> Linux is like a wigwam: no windows, no Gates, Apache inside. <<
Mit Zitat antworten
  #9 (permalink)  
Alt 04.04.2005, 22:47
Benutzerbild von Boris
Tanzender Webentwickler
XHTMLforum-Kenner
 
Registriert seit: 29.07.2004
Ort: Kornwestheim / Stuttgart
Beiträge: 4.925
Boris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer Mensch
Standard

Der 3px Abstandsbug vom IE ist echt nervig - denn manchmal funktioniert ein Fix, bei einem anderen Szenario funktioniert der gleiche nicht und man muss einen anderen ausprobieren (es gibt ja mehrere Ansätze).

Echt zum §$%&! ...
__________________
My software never has bugs. It just develops random features ...

» DevShack - die Website des freien Webentwicklers Boris Bojic
Mit Zitat antworten
Sponsored Links
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
Problem mit margin-left Shyne CSS 7 03.03.2008 19:02
Font der Überschrift ändern (Problem) artist CSS 2 07.12.2007 11:01
Design zu CSS/HTML verarbeiten - Problem häufen sich. Grafikamateur CSS 2 06.08.2007 10:57
Problem bei Div's - zwei mal das gleiche und doch nicht ... Niriel CSS 10 09.06.2005 18:39
Problem mit einem CSS Layout nARC CSS 20 21.05.2005 07:28


Alle Zeitangaben in WEZ +2. Es ist jetzt 14:53 Uhr.