✔ Css bekomme Abstand nicht in den Griff

S

starfoxfs

HI zusammen,

Ich möchte einen Inhalts Div darstellen dieser enthält eine Top Grafik eine Conten Grafik und eine Bottom Grafik.

Im HTML sieht das so aus:

PHP: 
<div class="contenttop"></div>
<div class="content">Hier der Content</div>
<div class="contentbottom"></div>

So der CSS ist hier:

PHP: 
.contenttop {
margin-left:auto;
margin-right:auto;
margin-top: 50px;
margin-bottom:0px;
bottom:0px;
width:995px;
height:20px;
background:url(../images/style/content-top.png);
}

.content {
margin-top:0px;
margin-left:auto;
margin-right:auto;
margin-bottom:0px;
width:995px;
background:url(../images/style/content.png);
}

.contentbottom {
margin-top:0px;
margin-left:auto;
margin-right:auto;
width:995px;
height:20px;
background:url(../images/style/content-bottom.png);
}

Problem an der Sache ist nun das ich sowohl bei Conttenttop einen Spalt zwischen der Grafik von Conttentop und Content habe und zwischen Content und Contentbottom ebenfalls.
 
Zuletzt bearbeitet von einem Moderator:
Zur Not die Holzhammermethode. Nimmst einen negativen margin bis es passt, z.B.:
PHP: 
.content {
margin: -3px auto -3px auto;
width:995px;
background:url(../images/style/content.png);
}

EDIT: Am besten mal im Firebug etwas rumspielen, das geht meist am schnellsten.
 
ich seh da keinen Abstand in welchem Browser soll das denn einen 'Abstand' anzeigen.

Vor dem Holzhammer würde ich folgendes mal versuchen ;) :
HTML: 
*{
    margin: 0px;
    padding: 0px;
    
}
 
Firefox 3.6 iss der Browser im IE hab ichs noch nicht probiert

Mit -3px funktionierts ....

Warum auch immer
 
Zuletzt bearbeitet von einem Moderator:
bei mir im FF sieht es gut aus allerdings habe ich die container relativ positioniert.
HTML: 
position: relative;
 
Hi,

was beinhalten denn die drei DIV-Blöcke konkret an Inhalt?

Dein Code alleine erzeugt nämlich keine Abstände zwischen ihnen - hab sie hier mal mit den drei "Ampelfarben" hinterlegt:

kein-abstand.jpg

mfg Maik
 
Hi Maik ich schätze er hat eine Überschrift im headercontent mit einer zu hohen line-height.
Kannst du mir eventuell bei meinem Problem helfen ?
Höflich fragend :)
hier
 
Maik hat gesagt.:
was beinhalten denn die drei DIV-Blöcke konkret an Inhalt?

Dein Code alleine erzeugt nämlich keine Abstände zwischen ihnen - hab sie hier mal mit den drei "Ampelfarben" hinterlegt:
Zum Vergrößern anklicken....

starfoxfs hat gesagt.:
Mit -3px funktionierts ....
Zum Vergrößern anklicken....
Kann es sein, dass in diesen DIVs jeweils ein <img>-Element eingebunden ist? Dieses Maß lässt nämlich die Vermutung zu.

Dann ist die display:block-Regel für das Grafikelement der Schlüssel zum Erfolg, damit die Whitespaces im HTML-Code (Zeilenumbrüche, Tab-Einrückungen) vom Browser nicht interpretiert werden, die im Textfluß einen abstand von "gefühlten" 3px ergibt.

mfg Maik
 
Jop ist eine png Grafik aber mit background eingebunden nicht mit image... im css
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück