| Autor |
Nachricht |
Braininsider
Threadersteller
Dabei seit: 18.11.2003
Ort: Halle
Alter: 42
Geschlecht: 
|
Verfasst Di 15.02.2005 11:43
Titel CSS Problem mit Bildern |
  |
|
Hi Mg`s,
ich habe ein Problem bei dieser Seite, wenn ein bild länger ist als der Text schiebt sich das bild (welches man grade nicht sieht) über meinen Contentbereich hinaus. Hier noch der Code bzw. Codeschnipsle:
| Codeschnipsel Contetnbereich hat geschrieben: |
<div id="contentBox">
<div id="inhaltBorder">
<div class="artikel_ueberschrift">Die PDF-Datei</div>
<div id="inhalt">
<!-- Einleitung anfang -->
<!-- Einleitung ende -->
<!-- autor anfang -->
<!-- autor ende -->
<p><b><img style="WIDTH: 150px; HEIGHT: 1450px" height="491" alt=" " hspace="4" src="http://burg-apotheke.braincms.com/media/bilder/test.jpg" width="150" align="left" vspace="4" border="0" />Aufgabe:</b></p>
<p>Die PDF-Datei stammt von der PostScript und ist somit Plattformunabhängig.<br />Die wesentlichsten eigenschaften einer PDF-Datei sind, das alle inhalte eines Dokumente mit allen eingebundenen Elementen (Schriften, Farben, Grafiken und Bildern) präzise wieder gegebenwerden, ohne dass diese einzeln <img hspace="4" src="admin/xeditor/smilys/testbild.GIF" align="middle" vspace="4" border="0" />mitgeliefert werden müssen. Eine PDF-Datei kann mit den komprimierungsverfahren JPG und LZW stark komprimiert werden. Das PDF-Format bietet praktische Zusatzfunktionen wie Kommentare, Verknüpfungen,Inhaltsverzeichnisse, Video und Audio Formate.</p>
<p></p>
<p><b>Aufbau:</b></p>
<p><br />Der Aufbau einer PDF-Datei ist streng strukturiert. Im Header steht vermerkt, um welche PDFVersion<br />es sich handelt. Dann kommt der Body mit den Beschreibungen der Objekte und den<br />Kommentaren, anschließend die Cross Referece Table mit den Informationen über die einzelnen<br />Objekte und am Schluss ein Trailer mit der Information, wo sich in der Datei die Cross Reference<br />Table befindet. Die Beschreibung der Objkte im Body geschiet durch die Boxen-Geometrien. </p>
<p>Definitionen der verschiedenen PDF-Boxen</p>
<p><i>MediaBox (Medien-Rahmen)</i><br />Die MediaBox zeigt die Größe des nicht beschnittenen PDFs. Diese ist zugleich die PostScript-Seitengröße, sofern das PDF über den Distiller erzeugt wurde. Die MediaBox ist stets die größte aller Boxen und schließt alle anderen Boxen vollständig ein.</p>
<p><i>CropBox (Masken-Rahmen)<br /></i>Dieser Masken-Rahmen beschneidet das PDF-Dokument für die Darstellung innerhalb des AdobeReaders oder in Acrobat, das heisst dass in den PDF-Betrachtungs-Programmen diese Box das gesamt sichtbare Dokument zeigt.<br />Die Elemente außerhalb der CropBox werden jedoch nur ausgeblendet; bei einer nachträglichen Vergrößerung des Masken-Rahmens können diese Elemente wieder sichtbar gemacht werden. Die CropBox beschreibt auch die Druckfläche des PDF<br />oder wie diese in eine EPS-Datei exportiert wird.</p>
<p><i>TrimBox (Endformat-Rahmen)<br /></i>Die TrimBox definiert das Endformat der Seite. Bei der Ausgabe einer A4-Seite mit Anschnitt und Druckmarken wäre die TrimBox A4. Da das Ausgabeformat für Beschnitt und Druckmarken größer sein muss, wäre es z. B. A4 Extra. Die MediaBox wäre also somit A4 Extra, die TrimBox hingegen A4.</p>
<p><i>BleedBox (Anschnitt-Rahmen)<br /></i>Dieser Rahmen beschreibt das Endformat (TrimBox) plus Beschnitt. Die BleedBox für eine A4-Seite mit 3 mm Anschnitt an allen Seiten wäre also 216 mm x 303 mm.</p>
<p><i>ArtBox (Objekt-Rahmen)<br /></i>Sie ist der kleinstmögliche Rahmen, der alle Elemente beinhaltet, die sich auf der entsprechenden PDF-Seite befinden.</p>
<p>Außer der CropBox ist keine andere Boxeninformation im AdobeReader sichtbar.</p>
<p>Der Zweck der Boxeninformationen ist, PDF-Dateien leichter automatisiert weiterverarbeiten zu können, da diese zusätzlichen Seiten-Informationen ausgelesen und weiterverwendet werden können.</p>
<p></p>
<p> </p><p>
<a href="javascript:history.back()" class="intro_weiter">zurück</a>
</p>
</div>
</div>
<div id="contentFussImg"> </div>
</div>
</div>
</div>
|
| Codeschnipsel CSS Contetnbereich hat geschrieben: |
/*** Inhalt ***/
#content{background-color:#FFFFFF;float:left;display:block;}
#contentBox{
width:530px;
margin:0px 27px 0px 1px;
_margin-right:14px; /* be nice to IE */
float:right;
clear:right;
display:block;
}
#inhaltBorder{
border:1px solid #7B92DF;
border-top:1px solid #7B92DF;
border-bottom:1px solid #FFFFFF;
min-height:280px;
display:block;
}
#inhalt, #inhaltIntro, #inhaltSuche{
padding:0px 15px 0px 15px;
}
#inhaltIntro{margin-top:15px;}
#introContent{padding-top:10px;}
.artikel_ueberschrift{
background-color:#D2DAF4;
border-bottom:1px solid #7B92DF;
font-weight:bold;
font-size:15px;
color: #A21518;
padding:3px 0px 3px 15px;
}
.intro_ueberschrift{color: #A21518;border:1px solid #7B92DF; background-color:#D2DAF4;}
#contentFussImg{
background: url(images/content_fuss.gif) no-repeat bottom left;
height:20px;
}
|
|
|
| |
   |
 |
mööp
Dabei seit: 29.08.2003
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 15.02.2005 13:28
Titel
|
|
|
|
ich wär dafür dass du den fehler mal explizit anzeigst, weil das die sache vereinfachen würde.
|
|
| |
|
|
|
Anzeige
|
|
|
Braininsider
Threadersteller
Dabei seit: 18.11.2003
Ort: Halle
Alter: 42
Geschlecht:
|
Verfasst Di 15.02.2005 13:38
Titel
|
|
|
Ok das stimmt hab versucht an alles zu denken aber naja.
Hier:
|
|
| |
|
|
eskimojane
Dabei seit: 12.02.2005
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 15.02.2005 14:04
Titel
|
|
|
beschwerdepunkt 1: der css-code ist unübersichtlich, durcheinander, mal so mal so geschrieben, viel zu viele verschiedene margin/padding-optionen.
beschwerdepunkt 2: das bild bekommt seinen style direkt im quelltext zugewiesen --> in großbuchstaben? mir dünkt, dass gerade css sowas nicht leiden kann. könnte probleme machen.
beschwerdepunkt 3: das bild steht im gleichen <p>-tag wie die überschrift "aufgabe", falls ich mich nicht verlesen habe. ein blocklevel-element und text in einem blocklevel-element. wirkt unsauber. möglicherweise auch ein grund
ansonsten etwas bonbonige seite, aber irgendwie süß. der apotheke gefüllt's sicherlich. 
|
|
| |
|
|
beeviZ
Dabei seit: 30.09.2002
Ort: -
Alter: -
Geschlecht:
|
Verfasst Di 15.02.2005 14:31
Titel
|
|
|
ich hab mir diesen übersichtlichen code gerade mal nich durchgelesen. aber sieht für mich so aus als hättest du a) ne feste höhe für den div container angegeben, oder b) dem bild n float: left zugewiesen.
lösung für a) aus height: xx einfach min-height: xx machen
lösung für b) unter das bild n <br style="clear: left" /> einfügen.
eine der beiden lösungen wirds sein. entscheide selbst!
Zuletzt bearbeitet von beeviZ am Di 15.02.2005 14:32, insgesamt 1-mal bearbeitet
|
|
| |
|
|
calvin
Dabei seit: 30.11.2004
Ort: Frankfurt am Main
Alter: -
Geschlecht:
|
Verfasst Di 15.02.2005 15:18
Titel
|
|
|
|
min-height funktioniert nicht im ie, clear könnte schon eher funktionieren, anosnten sieht mir das nach klassischem "absolut positionierte elemente wachsen nicht mit"-problem aus, ohne jetzt denen quelltext-wust angeschaut zu haben
|
|
| |
|
|
Braininsider
Threadersteller
Dabei seit: 18.11.2003
Ort: Halle
Alter: 42
Geschlecht:
|
Verfasst Di 15.02.2005 16:16
Titel
|
|
|
Ok ich habs.
Hier der neue Code:
HTML:
| Code: | <div id="contentBox">
<div id="inhalt">
"CONTENT"
</div>
</div> |
CSS:
| Code: |
#contentBox{
width:530px;
float:right;
clear:right;
margin-right:18px;
background: url(images/content_fuss.gif) no-repeat bottom left;
}
#inhalt{
width:527px;
border:1px solid #000000;
float:left;
margin-bottom:34px;
} |
Danke Forum!!
|
|
| |
|
|
beeviZ
Dabei seit: 30.09.2002
Ort: -
Alter: -
Geschlecht:
|
Verfasst Di 15.02.2005 20:26
Titel
|
|
|
| calvin hat geschrieben: | | min-height funktioniert nicht im ie, clear könnte schon eher funktionieren, anosnten sieht mir das nach klassischem "absolut positionierte elemente wachsen nicht mit"-problem aus, ohne jetzt denen quelltext-wust angeschaut zu haben |
nein. im IE funktionierts aber wenn man nur _height: xx angibt. Der Container wächst dann fälschlicherweise mit.
was war denn jetzt genau der fehler braininsider?
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
Problem mit CSS und Bildern im IE
Problem mit dyn. Auflösen von Bildern mit PHP
[Problem] mit digitalen Bildern
[ASP] Problem mit Bildern aus Datenbank
[PHP] Problem beim skalieren von Bildern
Coding - Problem mit Script/Faden von Bildern
|
|
Willkommen auf dem Portal für Mediengestalter
