• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

HILFE! Feste Framesetgröße in Firefox

P

Peer

Neues Mitglied
Guten Tag erstmal zusammen...

(Ich hoffe ich poste dies im richtigen Thread)

Ich habe da ein kleines Problem, dessen ich selbst nach längerer Suche nicht habhaft werden konnte. Undzwar geht es um ein HTML-Frameset, das im Firefox nicht seine feste Größe behält. Beim manuellen Verkleinern der Seite verschieben sich Frames übereinander, was relativ ungünstig für den späteren Inhalt ist!
Beim IE funktioniert es tadellos.
Hier mal der Code:

<frameset rows="*" cols="10%,1003,10%" framespacing="0" frameborder="NO" border="0" >
<frame src="../content/frames/left.htm" name="left2Frame" scrolling="no" noresize id="left2Frame">
<frameset rows="10%,562,10%" cols="*" framespacing="0" frameborder="NO" border="0">
<frame src="../content/frames/top.htm" name="topFrame" scrolling="NO" noresize>
<frameset cols="227,550,226" frameborder="NO" border="0" framespacing="0">
<frame src="../content/frames/left_in.htm" name="leftFrame" scrolling="NO" noresize>
<frameset rows="42,520" frameborder="NO" border="0" framespacing="0">
<frame src="../content/frames/main_top.htm" name="topFrame1" scrolling="NO" noresize>
<frame src="../content/frames/main.htm" name="mainFrame" scrolling="NO" noresize id="mainFrame">
</frameset>
<frame src="../content/frames/right_in.htm" name="rightFrame" scrolling="no" noresize id="rightFrame">
</frameset>
<frame src="../content/frames/bottom_int.htm" name="bottomFrame" scrolling="no" noresize id="bottomFrame">
</frameset>
<frame src="../content/frames/right.htm" name="right2Frame" scrolling="no" noresize id="right2Frame">
</frameset>

(made in Dreamweaver)

Ich hoffe dies sollte für HTML-Spezialisten kein Problem sein (bin bloss "blöder" Grafiker!) und bedanke mich schonmal im vorraus für eventuelle Hilfe...
 
dann machs mit modernem html und css. lies die in die Themen ein dann kannst du das auch umgehen.
Das Problem von Frames ist das jedes Frame einzeln als Seite geladen wird, ausserdem ist es nicht für
google und co nicht möglich deinen Inhalt zu crawlen.
 
Hm, ich dachte eigentlich, daß man hier Hilfe bekommt? Was ist denn "modernes" HTML?
Dennoch Danke für die Antwort...
 
Nachteile von Frames:
Frames: Vorteile und Nachteile
Subotnik: Warum Frames out sind (und es schon immer waren...)
Programmierung: Vor- und Nachteile von Frames in Webseiten
Vorteile und Nachteile von Frames
Und Hand aufs Herz: welche Webseiten kennst Du die aus Frames aufgebaut sind? ;)

"Modernes HTML" gibt es nicht wirklich. Heutzutage verwendet man nur eher HTML dafür wofür es schon immer gedacht ist: die semantische Auszeichnung von Inhalten. Frames gehören nicht dazu, sind nur Hilfsmittel und haben, wie Du oben nachlesen kannst, auch enorm viele Nachteile, nicht nur was die Gestaltung einer Seite angeht.

Einen Einstieg in HTML findest Du z.B. über die Links in unserer Quellensammlung. Auch diesen Wiki-Eintrag zu lesen dürfte erhellend sein.
 
Vielen Dank erstmal für das Aufzeigen der Dinge, die ich falsch gemacht habe. Da ich, wie gesagt, eher im grafischen Bereich zuhaus bin, möge man hier gewisse Unkenntnis verzeihen.
Aber da das Motto der Seite ja "...html.de hilft HTML-Anfängern und HTML-Profis..." ist, will ich wenigstens um einen Rat bitten, wie ich folgenden Seitenaufbau "modern" erstellen könnte.



sketch.jpg

I-Frames?
 
HTML: 
<!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>Untitled Document</title>
<style type="text/css"> 
<!-- 
body  {
    font: 100% Verdana, Arial, Helvetica, sans-serif;
    background: #666666;
    margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
    padding: 0;
    text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
    color: #000000;
}

.thrColHybHdr #container { 
    width: 100%;
    background: #FFFFFF;
    /*margin: 0 auto;  the auto margins (in conjunction with a width) center the page if needed */
    text-align: left; /* this overrides the text-align: center on the body element. */
}  
.thrColHybHdr #header { 
    background: #DDDDDD; 
    padding: 0 10px;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
} 
.thrColHybHdr #header h1 {
    margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
    padding: 10px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
}

.thrColHybHdr #sidebar1 {
    float: left; 
    width: 11em; /* since this element is floated, a width must be given */
    background: #EBEBEB; /* the background color will be displayed for the length of the content in the column, but no further */
    padding: 15px 0; /* top and bottom padding create visual space within this div */
}
.thrColHybHdr #sidebar2 {
    float: right; 
    width: 11em; /* since this element is floated, a width must be given */
    background: #EBEBEB; /* the background color will be displayed for the length of the content in the column, but no further */
    padding: 15px 0; /* top and bottom padding create visual space within this div */
}
.thrColHybHdr #sidebar1 h3, .thrColHybHdr #sidebar1 p, .thrColHybHdr #sidebar2 p, .thrColHybHdr #sidebar2 h3 {
    margin-left: 10px; /* the left and right margin should be given to every element that will be placed in the side columns */
    margin-right: 10px;
}

.thrColHybHdr #mainContent {
     margin: 0 12em 0 12em; /* the right margin can be given in ems or pixels. It creates the space down the right side of the page. */ 
    padding: 0 2em 0 2em; /* padding here creates white space "inside the box." */
} 
.thrColHybHdr #footer { 
    padding: 0 10px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
    background:#DDDDDD;
} 
.thrColHybHdr #footer p {
    margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
    padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}

/* Miscellaneous classes for reuse */
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
    float: right;
    margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
    float: left;
    margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
    clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
--> 
</style><!--[if IE]>
<style type="text/css"> 
/* place css fixes for all versions of IE in this conditional comment */
.thrColHybHdr #sidebar1, .thrColHybHdr #sidebar2 { padding-top: 30px; }
.thrColHybHdr #mainContent { zoom: 1; padding-top: 15px; }
/* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
</style>
<![endif]--></head>

<body class="thrColHybHdr">

<div id="container">
  <div id="header">
    <h1>Header</h1>
  <!-- end #header --></div>
  <div id="sidebar1">
    <h3>sidebar1 Content</h3>
    <p>The background color on this div will only show for the length of the content. If you'd like a dividing line instead, place a border on the left side of the #mainContent div if the #mainContent div will always contain more content than the #sidebar1 div. </p>
    <p>Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu, pellentesque  eget, cursus et, fermentum ut, sapien. </p>
  <!-- end #sidebar1 --></div>
  <div id="sidebar2">
    <h3>sidebar2 Content</h3>
    <p>The background color on this div will only show for the length of the content. If you'd like a dividing line instead, place a border on the right side of the #mainContent div if the #mainContent div will always contain more content than the #sidebar2 div. </p>
    <p>Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu, pellentesque  eget, cursus et, fermentum ut, sapien. </p>
  <!-- end #sidebar2 --></div>
  <div id="mainContent">
    <h1> Main Content </h1>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam,  justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam  ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo  porttitor, felis. Nam blandit quam ut lacus. </p>
    <p>Quisque ornare risus quis  ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at,  odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce  varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id,  libero. </p>
    <h2>H2 level heading </h2>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam,  justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam  ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo  porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis  ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio.</p>
    <!-- end #mainContent --></div>
    <!-- This clearing element should immediately follow the #mainContent div in order to force the #container div to contain all child floats --><br class="clearfloat" />
   <div id="footer">
    <p>Footer</p>
  <!-- end #footer --></div>
<!-- end #container --></div>
</body>
</html>

hier das kanns du einfach copy paste
Das gesamte style im head würde ich allerdings noch in eine eigene externe CSS Datei packen.
 
wow! hatte zwar noch keine zeit zum ausprobieren, aber ich stehe tief in deiner schuld und bin dir tausendfach dankbar. wünsch dir ein zauberhaftes wochendende...und danke nochmal!
peer
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben