nicht angemeldet
Seite im IE falsch dargestellt bei width auto od. right 0
Hallo!
Dies ist mein erster Post, bitte verzeiht, falls jemand schon mit diesem Problem einen Thread erstellt hat, bei der Forensuche konnte ich jedenfalls nichts entsprechendes finden.
Mein Problem ist folgendes:
Ich habe eine Seite in ASP (imho irrelevant) geschrieben, die eine zweite ASP-Seite inkludiert und ein externes CSS-File läd - diese wird im Firefox korrekt dargestellt, im Internet Explorer jedoch nicht - als würde er sich weigern das Stylesheet korrekt zu interpretieren. Es sollte eigentlich, wie im Firefox, ein Overflow gegeben sein, so dass am Div selbst Scrollbalken erscheinen - jedoch ist das dem Internetexplorer egal, er spannt, trotz width / height auf auto stehend UND bottom / right auf 0px das div nicht in der richtigen Größe auf, sondern lässt rechts eine Spalte von ~40px frei, unten jedoch sprengt er den sichtbaren Bereich der Seite, so dass die gesamte Seite scrollen kann, und nicht nur, wie gewünscht, das div. Außerdem ermöglicht er im div horizontales Scrollen und stellt es immer zur Verfügung - obwohl dies auch nicht der Fall sein sollte, da sich die Breite des Inhalts automatisch anpassen müsste.
Ich habe schon mehrere Sachen ausprobiert in CSS, bin jetzt jedoch mit meinem Latein am Ende und hoffe, dass die potentiellen Leser dieses Threads mir weiterhelfen können.
Als folgendes paste ich noch den gekürzten, relevanten Code der Seiten, verbleibe hoffend auf eine nützliche Antwort und bedanke mich selbstverständlich im voraus,
MagDragon.
Code:
index.asp
<html>
<head>
<noscript>
<link rel='stylesheet' href='styles/style1024.css' type='text/css'></link>
</noscript>
</head>
<body>
<div class="Main">
<div class="headSpaceLeft">
</div>
<div class="headLogoLeft">
<img src="./images/headerlogo.gif" height="85" alt="">
</div>
<div class="header">
Headertext
</div>
<div class="headLogoRight">
<img src="./images/headerlogo.gif" height="85" alt="">
</div>
<div class="headSpaceRight">
</div>
<hr class="header">
<div class="menue">
Ganz tolle Menüpunkte!
</div>
<div class="Werbung">
Ganz tolle Werbung!
</div<
<div class="Ueberschrift">
Links
</div>
<div class="Satzung">
Endlich der Text des Inhalts!
</div>
</div>
</body>
</html>
styles/style1024.css
a:active
{
color:#FCF9F4;
background-color:#404040;
text-decoration:none;
}
a:focus
{
color:#EEEEEE !important;
background-color:#404040;
text-decoration:none;
}
a:hover
{
background-color:#404040;
color:#EEEEEE !important;
text-decoration:none;
}
a:link
{
text-decoration:none;
color:#404040;
}
a:visited
{
text-decoration:none;
color:#404040;
}
body
{
background-image:url(../images/tatankaNeu300.gif);
color:#404040;
margin-left:0;
background-position:center;
background-attachment:fixed;
background-repeat:no-repeat;
font-family:Verdana,Arial,Helvetica,Sans-Serif;
margin-top:0;
background-color:#FCF9F4;
font-size:9pt;
}
div.header
{
font-family:Verdana,Arial,Helvetica,Sans-Serif;
font-size:36pt;
position:absolute;
left:210px;
width:570px;
float:right;
margin-top:20px;
height:90px;
}
div.headLogoLeft
{
width:60px;
position:absolute;
margin-top:3px;
left:150px;
height:90px;
}
div.headLogoRight
{
margin-top:3px;
left:780;
height:90px;
position:absolute;
width:60px;
}
div.headSpaceLeft
{
left:0;
width:150px;
height:90px;
top:0;
position:absolute;
}
div.headSpaceRight
{
left:840px;
position:absolute;
height:90px;
width:auto;
}
div.Main
{
bottom:0px;
top:0px;
right:0px;
left:0px;
}
div.menue
{
left:0px;
height:auto;
line-height:20px;
width:200px;
top:60px;
position:absolute;
padding-top:30px;
padding-left:40px;
}
div.Satzung
{
overflow:scroll;
left:200px;
position:absolute;
top:160px;
padding-left:30px;
scrollbar-arrow-color:solid gray;
padding-right:20px;
right:0px;
line-height:16px;
text-align:justify;
width:auto;
bottom:0px;
height:auto;
scrollbar-highlight-color:solid gray;
}
div.Ueberschrift
{
position:absolute;
left:200px;
font-family:Verdana,Arial,Helvetica,Sans-Serif;
font-size:14pt;
padding-top:20px;
width:auto;
height:70px;
top:90px;
}
div.Werbung
{
left:0px;
padding-left:50px;
bottom:0px;
position:absolute;
padding-bottom:18px;
}
^-- dazu gibt es noch ein paar font-Elemente und auch ein paar table- und td-Elemente, die auch im div "Satzung" vorkommen, die sollten jedoch für die Darstellung bzw. Größe der divs unwichtig sein, da sie ja nur in einem befindlich sind - oder irre ich?
Falls noch mehr Informationen benötigt werden, einfach schreien! ;)
-
hi,
jedoch ist das dem Internetexplorer egal, er spannt, trotz width / height auf auto stehend UND bottom / right auf 0px das div nicht in der richtigen Größe auf
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Zum x-ten Mal: der IE beherrscht es nicht, die Maße eines absolut positionierten Elementes aus der Vorgabe zweier "gegenüberliegender Koordinaten" zu ermitteln.
Mache Angaben zu width und/oder height.Gut, habe ich schon gemacht - ohne angaben bzgl. der Position von Bottom / Right sondern nur width und height auf auto - kann der IE damit auch nicht umgehen. Muss ich wirklich eine absolute Höhen- / Breitenangabe machen, damit der IE das annähernd richtig interpretiert? Mein Problem wäre dabei dann die Skalierbarkeit des Browserfensters...
Danke für die schnelle Antwort, wahsaga, auch wenn sie mir in dem Fall nicht wirklich viel weiterhelfen konnte ^^
-
hi,
Gut, habe ich schon gemacht - ohne angaben bzgl. der Position von Bottom / Right sondern nur width und height auf auto - kann der IE damit auch nicht umgehen.
Was heißt, er kann damit nicht umgehen?
Wenn du auto sagst, wird auch auto genommen - mit allen seinen Auswirkungen. Sind dir diese bekannt?Muss ich wirklich eine absolute Höhen- / Breitenangabe machen, damit der IE das annähernd richtig interpretiert?
Wenn du eine explizite Höhe haben willst, musst du (zumindest im IE, in diesem Falle) eine explizite Höhenangabe machen, ja.
Mein Problem wäre dabei dann die Skalierbarkeit des Browserfensters...
Man soll ja Höhen beispielsweise auch in Prozent angeben können ...
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
re nochmal
Was heißt, er kann damit nicht umgehen?
Wenn du auto sagst, wird auch auto genommen - mit allen seinen Auswirkungen. Sind dir diese bekannt?Anscheinend nicht. Ich ging davon aus, wenn ich auto angebe, dass er den Rest des Browserfensters "füllt".
Wenn du eine explizite Höhe haben willst, musst du (zumindest im IE, in diesem Falle) eine explizite Höhenangabe machen, ja.
Man soll ja Höhen beispielsweise auch in Prozent angeben können ...Mein Problem in dem Fall:
Ich hab einen Header und ein Menü - diese hab ich als Div angegeben und diese sollen eine feste Breite bzw. Höhe haben - nun wollte ich jedoch für das "Main"-Div (in diesem Falle Satzung) keine fixe Höhe haben, sondern, dass sich dieses Div in den freien Platz, nachdem ich die Top- und Left-Position angegeben habe, "anschmiegt".Soll heißen:
Bei "Vollbild"-Browserfenster:
*-----------------------------------*
| HEADER |
*----*------------------------------*
| | |
| | |
| | |
| | |
|MENÜ| CONTENT |
| | |
| | |
| | |
*----*------------------------------*Bei resizedtem-Browserfenster:
*------------------------*
| HEADER |
*----*-------------------*
| | |
|MENÜ| CONTENT |
| | |
*----*-------------------*Ich habe sozusagen versucht das "auto" wie * bei Framesets zu verwenden - ist das falsch? Wie kann ich dennoch meine Absicht per CSS realisieren?
Abermals vielen Dank im voraus und auch Danke an wahsaga,
MagDragon.
-
-
-