nicht angemeldet
div problem bei zuviel div inhalt beim explorer...
hallo zusammen,
habe ein problem mit dem ich mich jetzt schon den ganzen tag rumschlage...
ich habe ein webseite welche nur aus divs und css besteht navigiert wird über javascript indem einzelne divs ein und ausgeblendet werden.
das navigieren klappt gut solange kein inhalt oder nur wenig in den divs drinn steckt.
sobald ich aber zuviel inhalt in die divs packe macht der explorer probleme.im mozilla funktioniert das ganze astrein.
das layout wird im explorer total zerissen.
ich meine mit zuviel inhalt nicht das der inhalt nicht mehr in die div passt, sondern der inhalt hat sehr wohl noch platz in der div aber es zerreißt das layout trotzdem.
ich habe alle margins und paddings raus genommen um auszuschließen dass
das problem dadurch entsteht.
ich weiß echt nicht woran das ganze liegt...
ich hoffe ihr habt eine idee...
hier also mal der quelltext es sieht ein wenig wild aus. verzeiht mir das...ich hoffe es ist hier üblich so lange queltexte zu posten...
liebe grüße bob b
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html><head>
<link rel="stylesheet" href="main_css.css" type="text/css">
<script src="show_hide.js" type="text/javascript"></script>
<title>tikjgh</title>
</head>
<body>
<div class="main_container">
<div class="column_1">
<div class="links_1">
<div class="platzhalter_links1"></div>
<div class="links_text_bg">
<div class="links_div" onclick="reset_fu()">reset</div>
<div class="links_div" onclick="work_fu()">work</div>
<div class="links_div" onclick="links_fu()">links</div>
<div class="links_div" onclick="contact_fu()">contact</div>
</div>
</div>
<div class="content_1">
<div class="news_text_bg">news
</div>
</div>
</div>
<!--content_reset-->
<div class="content_reset" id="start">
<div class=column_2>
<div class="links_2">
<div class="platzhalter_links2"> </div>
<div class="links_text_bg"> animation graphic photos </div>
</div>
<div class="content_2">
</div>
</div>
<div class=content_3>
</div>
</div>
<!--/content_reset-->
<!--content_work-->
<div class="content_work" id="work">
<div class=column_2>
<div class="links_2">
<div class="platzhalter_links2"> </div>
<div class="links2_text_bg">
<div class="links_div" onclick="reset_fu()">reset</div>
<div class="links_div" onclick="work_fu()">work</div>
<div class="links_div" onclick="links_fu()">links</div>
<div class="links_div" onclick="contact_fu()">contact</div>
</div>
</div>
<div class="content_2">
</div>
</div>
<div class=content_3>
</div>
</div>
<!--/content_work-->
<!--content_links-->
<div class="content_links" id="links">
<div class=column_2>
<div class="links_2">
</div>
<div class="content_2">
</div>
</div>
<div class=content_3>
</div>
</div>
<!--/content_links-->
<!--content_contact-->
<div class="content_contact" id="contact">
<div class=column_2>
<div class="links_2">
</div>
<div class="content_2">
</div>
</div>
<div class=content_3>
</div>
</div>
<!--/content_contact-->
</div>
</body>
</html>
und hier der css code:
body
{
background:#F2F2F2;
text-align:center;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:8pt;
color:#FFFF00;
}
.main_container
{
height: 500px;
width: 800px;
margin:auto;
}
.column_1
{
height: 500px;
width: 200px;
float:left;
}
.links_1
{
background: url(img/links1.jpg);
height: 100px;
width: 200px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:8pt;
}
.content_1
{
background: url(img/content1.jpg);
height: 300px;
width: 200px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:8pt;
text-align:right;
}
.news_text_bg
{
background: #000000;
display:inline;
}
.links_text_bg
{
background: #000000;
height:13px;
width:200px;
}
.links2_text_bg
{
background: #000000;
height:13px;
width:300px;
}
.column_2
{
height: 500px;
width: 300px;
float:left;
}
.links_2
{
background: url(img/links2.jpg);
height: 100px;
width: 300px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:8pt;
}
.content_2
{
background: url(img/content2.jpg);
height: 300px;
width: 300px;
text-align:left;
}
.content_3
{
background: url(img/content3.jpg);
height: 400px;
width: 300px;
float:right;
}
.content_reset
{
display: none;
height: 400px ;
width: 600px;
float:right;
}
.content_work
{
display:none;
height: 400px;
width: 600px;
float:right;
}
.content_links
{
display:none;
height: 400px;
width: 600px;
float:right;
}
.content_contact
{
display:none;
height: 400px;
width: 600px;
float:right;
}
.links_div
{
float:right;
cursor:pointer;
background:green;
}
.platzhalter_links1
{
background:red;
height:87px;
width:200px;
}
.platzhalter_links2
{
background:red;
height:87px;
width:300px;
}
und noch das javascript:
function reset_fu () {
document.getElementById("start").style.display = "block";
document.getElementById("work").style.display = "none";
document.getElementById("links").style.display = "none";
document.getElementById("contact").style.display = "none";
}
function work_fu () {
document.getElementById("start").style.display = "none";
document.getElementById("work").style.display = "block";
document.getElementById("links").style.display = "none";
document.getElementById("contact").style.display = "none";
}
function links_fu () {
document.getElementById("start").style.display = "none";
document.getElementById("work").style.display = "none";
document.getElementById("links").style.display = "block";
document.getElementById("contact").style.display = "none";
}
function contact_fu () {
document.getElementById("start").style.display = "none";
document.getElementById("work").style.display = "none";
document.getElementById("links").style.display = "none";
document.getElementById("contact").style.display = "block";
}
-
Hallo,
ein erster Hinweis: Nach dem Quelltext ist die Seite niemals XHTML!
Mit freundlichen Grüßen
André
--
ss:{ zu:) ls:& fo:) de:] va:) ch:{ sh:) n4:# rl:° br:& js:| ie:% fl:| mo:}
http://forum.de.selfhtml.org/archiv/2003/10/60651/#m341175-
Hallo,
ein erster Hinweis: Nach dem Quelltext ist die Seite niemals XHTML!
Also davon abgesehen, dass er nicht den Namensraum <html xmlns="http://www.w3.org/1999/xhtml"> angegeben hat und dass er bei einigen <div class="content_2"> und <div class="content_3"> die Anführungszeichen um den Attributwert vergessen hat, ist es XHTML und die Fehler hatten keinen Einfluß auf die float-Probleme beim IE. ;-)
Grüße
Thomas-
Hallo,
Also davon abgesehen, dass er nicht
...entweder schreibt er wie in der DTD 'strict' geschrieben oder er lässt es sein. Er hat nicht 1.) .... 2.) .... 3.) .... ist doch echt doof. Es gibt einen Regelrahmen.
Außerdem hat er _auch_ nicht den <link>-Bereich abgeschlossen.
Mit freundlichen Grüßen
André
--
ss:{ zu:) ls:& fo:) de:] va:) ch:{ sh:) n4:# rl:° br:& js:| ie:% fl:| mo:}
http://forum.de.selfhtml.org/archiv/2003/10/60651/#m341175-
oh peinlich peinlich...also das mit dem doctype tut mir leid das hatte ich schon weiter oben geschrieben...und mit den anführungs zeichen auch....manchmal sieht man den wald vor lauter bäumen nicht mehr...
-
-
-
-
Hallo,
das layout wird im explorer total zerissen.
ich weiß echt nicht woran das ganze liegt...Genau sagen kann ich es dir auch nicht, aber es ist ein Problem das durch die verschiedene float:...; Angaben entsteht.
Ich würde an diner Stelle auch überlegen ob so eine Strutur wirklich sinnvoll und vor allem ob sie _wirklich_ wartbar ist.
Grüße
Thomas -
Hallo bob,
ich habe ein webseite welche nur aus divs und css besteht navigiert wird über javascript indem einzelne divs ein und ausgeblendet werden.
das ist ganz schlecht - ein User ohne js wird deine Seite nicht benutzen können, außerdem muss er immer den kompletten Inhalt runterladen, auch wenn er nur eine Seite sehen will. Deswegen brauchst du imho auch nicht weiter an dem Problem "herumdoktorn" - mach einfache statische (oder auch serverseitig zusammengebaute) Seiten und fertig.
Grüße aus Nürnberg
Tobias--
Selfcode: sh:( fo:) ch:? rl:( br:< n4:& ie:% mo:| va:) de:] zu:) fl:( ss:| ls:[ js:| -
oh das tut mir leid ...da habe ich wohl ausversehen eine zwischenversion des quelltextes gepostet...
ich sitze da jetzt schon echt lange an diesem problem und habe halt schon alles mögliche ausprobiert, unter anderem auch verschiedene doctypes.
also sorry.ich habe das ganze mal aufgeladen damit man es sich ansehen kann.
http://minzky.de/minzky_css/index7.htm
wenn man auf reset klickt wird das ganze richtig angezeigt aber sobald man auf work klickt wird das ganze zerissen...im explorer
-
Hallo,
oh das tut mir leid ...da habe ich wohl ausversehen eine zwischenversion des quelltextes gepostet...
ich habe das ganze mal aufgeladen damit man es sich ansehen kann.
(das war eine ausgesprochen gute Idee)
Es ändert sich aber nichts daran was ich unter: [pref:t=78232&m=452417] zu float im IE gesagt habe.Grüße
Thomas-
Danke für den Tip,
ich werde die float Atribute nochmal durch denken.
Vom Aufbau der Seite in Bezug auf Wartung hast du natürlich Recht.
Aber den gesteigerten Aufwand nehme ich in kauf.
Evtl. setze ich aber auch iframes ein und nimm das javascript raus.Werde das ganze nochmal überdenken.
-
-