HTML: Relative Größenangaben im FF - Problem

[malo]

Hi!

Ich bin wieder mal mit einem Webseitenproblem hier... und zwar hab ich folgendes Problem:

Ich habe in einer HTML-Seite einen div-Bereich mit relativer Breiten-Angabe (%). Das Problem ist nun: Ich hab die Angabe auf den IE spezialisiert (da dort getestet). Aber der FF macht damit Probleme...

Und zwar glaub ich, dass der FF bei relativen Angaben immer die komplette Breite der HTML-Seite nimmt, und die Größe dann mehr oder weniger fest auslegt. Demnach erhalte ich bei meiner Seite, wenn ich als Breitenangabe "70%" angebe, einen horizontalen Scrollbalken, weil der Bereich zu viel Platz einnimmt.

Jetzt hab ich aber schon alles mögliche probiert - z.B. hab ich versucht ein "Right-Margin" zu setzen, allerdings hilft das beim FF auch nicht.

Nun bin ich zu der Methode angelangt, dass ich einfach abfrage, welcher Browser benutzt wird, und dementsprechend die Angabe mach. Allerdings funktioniert das dann überhaupt nicht richtig...

Folgender Quellcode:

Code:

<script type="text/javascript">
<!--
  browser=navigator.appName;
  if (browser == "Netscape")
    {
    document.write('<div id="inhalt" style="width: 10%>"');
    }
  else
    document.write('<div id="inhalt" style="width:70%>"');
//-->
</script>
<noscript><div id="inhalt" style="width:70%"></noscript>

Der FF reagiert weder auf die style-Angabe im "if"-Teil, noch auf die im "else"-Teil. Und JS ist auch an.

Folgendes funktioniert aber:

Code:

<div id="inhalt" style="width:10%">

Hat jemand eine Idee, was ich hier falsch mach, bzw. wie ich das auch im FF richtig anzeigen lassen kann?

[muRR]

Bist du sicher, dass das Script überhaupt ausgeführt wird? Meiner Meinung nach müsste es mit

Code:

<script language="JavaScript">

beginnen.

Edit:
Ich sah grad, dass man es auch so machen kann. Allerdings sehe ich das Attribut "width" laut http://de.selfhtml.org/navigation/su...uchanfrage=div nicht. Könnte es daran liegen?

Nein, sollte es auch nicht, denn die Universalattribute lassen CSS zu.

[malo]

Zitat von muRR:

Bist du sicher, dass das Script überhaupt ausgeführt wird? Meiner Meinung nach müsste es mit

Code:

<script language="JavaScript">

beginnen.

Ja, und es wird auch im FF in den "If"-Teil gesprungen. Bei folgendem Test erscheint oben noch die Schrift "Hallo Welt".

Code:

  if (browser == "Netscape")
    {
    document.write('hallo welt');
    document.write('<div id="inhalt" style="width: 10%>"');

    }

Wobei ich immer dachte, es müsste streng genommen "text/javascript" heißen

[Matze]

"language" gibt es bei XHTML nicht mehr, dort gibt es nur noch type, bei HTML auch language und dann muss es dort auch nur "Javascript" heißen, im Gegensatz zu type, so es "text/javascript" heißen muss.

Also FF hat mit der Breite von Divs keine Probleme. Hier habe ich beidesmal 50% als Breite angegeben und es wird korrekt interpretiert.

[malo]

Zitat von Matze:

Also FF hat mit der Breite von Divs keine Probleme. Hier habe ich beidesmal 50% als Breite angegeben und es wird korrekt interpretiert.

Ich fang ja nicht ganz linksbündig an. Ich hab links daneben z.B. noch eine (per CSS ausgerichtete) Liste ([*]), und rechts und links davon noch ein paar Pixelchen Platz, bis mein div-Bereich kommt.

Einmal ein Screenshot, wie das aussehen tut.

Styles etc. natürlich noch nicht fertig, ich experimentiere noch (mir gehts im Moment um das Wichtige - die kreativen Dinge lass ich später von irgendwem machen )

edit: Im Screenshot ist die Breitenangabe, wie sie mit dem JS-Quellcode aussieht...

[Matze]

Hast du evtl den Source, der dort dargestellt wird? Also klar du hast ihn, aber kannst du ihn bitte posten?

[malo]

Ich bezweifle, dass der IRGENDWIE helfen wird

Ich frag mich aber, wieso alle immer den Quelltext haben wollen

Code:

<script type="text/javascript">
<!--
  browser=navigator.appName;
  if (browser == "Netscape")
    {
    document.write('hallo welt');
    document.write('<div id="inhalt" style="width: 10%>"');

    }
  else
    document.write('<div id="inhalt" style="width:50%>"');
//-->
</script>
<noscript><div id="inhalt" style="width:70%"></noscript>





<?
  //echo $mode['mode'];
  $query = 'SELECT content,title FROM ' . $table_prefix . 'index WHERE id="'.$mode['mode'].'"';
  $result = mysql_query($query);
  //if ($result) echo "true "; else echo "false";
  while ($row = mysql_fetch_array($result, MYSQL_ASSOC))
    {
     echo('<div class="headline">' . $row['title'] . "</div>\n");
     echo('<div class="text">' . $row['content'] . '</div>');
    }
?>



</div>

Auf die "wichtigen" Teile gekürzt.

Das Stylesheet:

Code:

div#Inhalt {
    margin-left: 12em;
    margin-right: 0em;
    padding: 0 1em;
    border: 1px dashed silver;
  }

[Matze]

Zitat von malo:

Ich frag mich aber, wieso alle immer den Quelltext haben wollen

Weil's so leichter nachvollziehbar ist. Allerding meinte ich das, was man über "Ansicht" - "Seitenquelltext anzeigen" sehen würde, das wäre übersichtlicher als so.

[Flocke]

Du hast zwei kleine Tippfehler drin:

Code:

document.write('<div id="inhalt" style="width: 10%[color=red]>"[/color]');
document.write('<div id="inhalt" style="width: 10%[color=blue]">[/color]');

(in der Zeile weiter unten auch noch mal)

Vielleicht nimmt FF die Angaben deshalb nicht?

[malo]

Zitat von Matze:

Zitat von malo:

Ich frag mich aber, wieso alle immer den Quelltext haben wollen

Weil's so leichter nachvollziehbar ist. Allerding meinte ich das, was man über "Ansicht" - "Seitenquelltext anzeigen" sehen würde, das wäre übersichtlicher als so.

Ja, das dachte ich mir im Nachhinein auch... aber immer wenn ich den Quellcode abschicken will, streikt der Server

Auf die wichtigsten Stellen gekürzt:

Code:

<html>

<div style="text-align:center">
<div style="margin:auto"> <img href=http://.de/a.jpg> 
</div>
</div>
<ul id="Navigation">[*][url="index.php?mode=test"]b[/url][*]a
[*][url="index.php?mode=test"]c[/url][*]x[/list]

<script type="text/javascript">
<!--
browser=navigator.appName;
if (browser == "Netscape")
{ document.write('hallo welt');
document.write('<div id="inhalt" style="width: 10%>"');

}
else
document.write('<div id="inhalt" style="width:50%>"');
//-->
</script>
<noscript><div id="inhalt" style="width:70%"></noscript>





<div class="headline">aggg</div>
<div class="text">bggg</div><div class="headline">bbbb</div>

<div class="text">cccc</div>


</div>

edit: