✔ Div mittels include füllen

Status
Nicht offen für weitere Antworten.
speicher

speicher

Erfahrenes Mitglied
Hallo,

ich habe ein Layout für eine Seite mit CSS erstellt. Wenn ich nun den Conten DIV
fülle mit Text, paßt sich alles wie gewünscht diesem an. Füge ich jedoch Inhalte mittels
include('datei.php'); ein, so werden alle Formatierungen nicht beachtet und die Datei
wird über die Content-Div Grenzen hinaus gefüllt. Schlimmer noch, das Div paßt sich auch nicht der Höhe an.

Kann man dies irgendwie ändern

Danke für jede Hilfe.


HTML
Code: 
<!DOCTYPE html PUBLIC
 "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/
  xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
   xml:lang="de" lang="de">
 <head>
  <title>3 Spalten</title>
 <style type="text/css" media="screen">
  <!-- @import url(pos.css); --></style>
 </head>

 <body>
<div style="width:900px;margin:0px auto;text-align:left;background-color:#bdbec6;border:1px solid #000000;">
  <div id="contentWrapper">
   <div id="content">
    <h1>Unsere wichtige Überschrift</h1>
    <p>Text, den jeder lesen muss.</p>
   WENN DIES  PER INCLUDE passiert ist das LAYOUT nicht angepaßt
    werwerwerw
    erwerw
    erwer
    werwerwrwerwerwerwwwwwwwwwwwwwwwwwwwwwwwwwwwww
    werwwwwwwwwwwwwwwwwwwwww
    werwwwwwwwwwwwwwwwer
    werrrrrrrrrrrrrrrrr
    werrrrrrrrrrrrrrr
    werrrrrrrrrrrrrrrr
    werrrrrrrrrrrrrrrr
    <img src="logo.JPG">

   </div>

  </div> 

  
  <div id="rightbar">
   <p>Unsere News</p>
  </div>


  <div id="clearDiv">&nbsp;</div>

  <!-float-modus aufheben -->

  <div id="footer">
   <p>Copyright, Impressum</p>
  </div>

  <div id="header">
   <h1>Header genügend Platz für ein Logo</h1>
  </div>

</div>
 </body>

</html>
CSS DATEI
Code: 
*{margin: 0;}

body {
 font-family: tohoma ,Arial,
 Helvetica, sans-serif;
 font-size: 100%;
 text-align:center;}



#contentWrapper {
 width: 100%;
 max-width:900px;
 float: left;
 margin-right: -36%;}

#content {
 margin-right: 36%;
 border: 1px solid yellow;
 margin-top: 62px;
 height:100%}

#rightbar {
 width: 34%;
 float: right;
 border: 1px solid Fuchsia;
 margin-right: -1px; /*dummy */
 margin-top: 62px;}



#clearDiv{
 clear: both;
 position:relative;
 line-height: 1px;}

#footer {
 background:blue;}

#header{
 position: absolute;
 height: 62px;
 border: 1px solid green;
 width: 100%;
 max-width:900px;
 top: 0;}
 
Hi;

ich habe mal eine normale Textdatei eingebunden, jedoch hat sich dadurch am Aussehen der Seite nichts geändert...

Liegt es vielleicht an der Datei, die du einbindest?

Greetz
 
Also ich habe versucht eine php-Datei einzubinden. Es sollte später auch mit einer funktionieren. Die Darstellung dieser Datei war ok, jedoch paßte sich das Layout nicht an.
 
Hallo,

Wirklich sehr merkwürdig.
Von wo nach wo geht denn das INCLUDE genau? Gehören das öffnende und abschließende DIV#content zu index.php (ich nenn' die jetzt einfach mal so) oder zu datei.php? Und was steht dann genau in der datei.php?

Schöne Grüße
27apricot.
 
Die hier veröffentlichte html datei ergänze ich im #content-DIV um <?include('include.php'');?>
Diese include.php ist enthält Bilder und Text, die eine komplette HTML Datei mit body, head und divs ist.

Ich habe nun einmal head und body entfernt und auf einmal geht es. Nun stellt sich mir aber gleich ein weiteres Problem. Wenn die Inhalte der included.php zu breit sind, verschiebt sich mein layout. Kann ich da nicht etwas machen?
 
Der ausschlaggebende Punkt ist ja die include.php.

Besonders die DIVs sind wichtig, wenn du diese mit CSS-Eigenschaften formatiert hast.

Wenn dem so ist, poste bitte die include.php, damit wir dir helfen können oder ändere die CSS-Eigenschaften in derselben Datei.

Greetz
 
Hallo speicher,

Ganz genau das isses: in der include.php muss/darf nur noch stehen:
Code: 
<h1>Unsere wichtige Überschrift</h1>
    <p>Text, den jeder lesen muss.</p>
   WENN DIES  PER INCLUDE passiert ist das LAYOUT nicht angepaßt
    werwerwerw
    erwerw
    erwer
    werwerwrwerwerwerwwwwwwwwwwwwwwwwwwwwwwwwwwwww
    werwwwwwwwwwwwwwwwwwwwww
    werwwwwwwwwwwwwwwwer
    werrrrrrrrrrrrrrrrr
    werrrrrrrrrrrrrrr
    werrrrrrrrrrrrrrrr
    werrrrrrrrrrrrrrrr
    <img src="logo.JPG">
Also nicht unbedingt DIVs (außer du hast noch welche, die dem DIV#content untergeordnet sind) und auf keinen Fall übergeordnete Tags wie <head>, <body>, <html>.
Denn PHP macht nichts anderes als HTML-Dateien generieren. Wenn du also alle Kopf- und sonstigen Daten in der include.php mit drin hast, steht das in der generierten HTML-Datei zweimal. Sieh dir einfach mal den Quelltext einer auf diese Weise generierten Datei an.

Und was die zu breiten Inhalte angeht: Wenn du dir die include.php nur als den Kasten vorstellst, den du damit füllen willst, weißt du, dass du auch nur entsprechend breite Inhalte dort hineinsetzen kannst. Ist dein DIV#content beispielsweise 300px breit, solltest du halt kein 400px breites Bild in die include.php schreiben. Ansonsten kannst du über CSS mit dem Attribut overflow steuern, was mit übergroßen Inhalten passiert (siehe selfHTML).

Übrigens kannst du auch Bildern mit CSS eine relative Größe (also %) geben. Man sollte jedoch zusätzlich eine absolute Maximal-Größe definieren (max-width/max-height), damit kleine Bilder nicht so hässlich groß gezogen werden. Das einzig doofe daran: der IE kann mit max-width/max-height nix anfangen, alle anderen aktuellen Browser aber schon.

Schöne Grüße
27apricot
 
Ich habe die include.php jetzt auf ein Minimum reduziert.
Lasse ich das DIV in dieser weg, funkltioniert alles prima, jedoch kann ich dann das
Bild, nicht, wie gewünscht positionieren.

Wenn ich position:relative setzt, dann führt er dies leider nicht aus. Das Bild "klebt" links
im #content-Div der index.php



INCLUDE.PHP
Code: 
<div style="position:absolute;top:135;left:91">
<img border="0" src="logo.JPG" width="266" height="265"></div>werrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrr
werrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrr
 
Es gibt bestimmt eine andere Lösung als eine absolute Positionierung.

Wie möchtest du es denn positioniert haben?

Greetz
 
Hallo,

ich glaub', du hast noch das mit dem include noch nicht ganz verstanden. Geh' mal andersrum ran:

Schreib' eine ganz gewöhnliche HTML-Datei mit allen Inhalten, die du »includen« willst und nenn' sie beispielsweise index.php, auf jeden Fall .php. Wenn du fertig bist und alles so aussieht, wie du es haben willst, schneide alles zwischen <div id="content"> und dem dazugehörigen Abschluss-Tag aus und kopiere es in eine neue, leere Datei. Die nennst du dann include.php. In der index.php schreibst du nun an die selbe Stelle
PHP: 
<?php include "include.php"; ?>
Jetzt generiert ein php-fähiger Server eine HTML-Datei, die so aussieht, wie du sie vorher geschrieben hast.
Natürlich können auch in der include.php noch DIVs drin sein, sorry, wenn ich mich da vorhin missverständlich ausgedrückt habe. Aber diese DIVs stehen dann eben innerhalb des DIV#content, eben da, wo du den php-Befehl zum einschließen der Datei gegeben hast.

Schöne Grüße: 27apricot.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück