DIV richtet sich nicht ganz oben aus
Hans
- css
0 wahsaga0 Hans
0 Gunnar Bittersmann1 Bla0 Hans
Hallo,
ich habe das Problem, dass ich ein Div-Element einfach oben wie ein Banner haben will. Im IE geht das auch wunderbar, aber im Firefox habe ich immer zwischen oberem Rand und Div-Anfang ein freies Stück.
An was kann das liegen?
Hier der Link:
http://www.baumanagement-babilon.de/
Hier ein Ausschnitt aus dem Quelltext:
<body style="font-family: arial; background-color: #FBFBFF; background-image: url('hg.gif'); background-attachment: fixed; margin:0px; line-height:200%; border:0;">
<div style="margin:0; padding:0; background: #3f3f9f; background-image: url(banner.gif); background-repeat:no-repeat; color: #ffffff; line-height: 300%; font-size:14pt;">
<p align="center">Projektmanagement Projektsteuerung Facility
Management Consulting Bauherrenberatung
</div>
hi,
ich habe das Problem, dass ich ein Div-Element einfach oben wie ein Banner haben will. Im IE geht das auch wunderbar, aber im Firefox habe ich immer zwischen oberem Rand und Div-Anfang ein freies Stück.
An was kann das liegen?
Am Default-Padding von body?
Hier der Link:
http://www.baumanagement-babilon.de/Hier ein Ausschnitt aus dem Quelltext:
<body style="font-family: arial; background-color: #FBFBFF; background-image: url('hg.gif'); background-attachment: fixed; margin:0px; line-height:200%; border:0;">
Für Beispielcode inline-Styles zu verwenden, ist OK - aber innerhalb eines echten Dokumentes, Pfui.
Und den Quirks Mode solltest du auch verlassen, in dem du eine Doctype-Angabe ins Dokument einfügst.
gruß,
wahsaga
Am Default-Padding von body?
habs geändert, funzt aber trotzdem nicht (sonst wären ja auch links und rechts ränder gewesen...)
Für Beispielcode inline-Styles zu verwenden, ist OK - aber innerhalb eines echten Dokumentes, Pfui.
Ja, ist schon klar, aber es geht im Moment nur ums Design, und da kann ichs schneller direkt im Dokument ändern.
Hallo,
» » Am Default-Padding von body?
Kann es vielleicht am "line-height:200%;" liegen?
Gruß,
Floater
Hello out there!
Für Beispielcode inline-Styles zu verwenden, ist OK
Ganz entschiedenes Nein, denn ...
es geht im Moment nur ums Design, und da kann ichs schneller direkt im Dokument ändern.
... potentielle Helfer können den Code aber schlechter überschauen und das Problem schwerer finden.
Und wozu willst du dir doppelte Arbeit machen anstatt gleich richtig[tm]?
See ya up the road,
Gunnar
Hello out there!
ich habe das Problem, dass ich ein Div-Element einfach oben wie ein Banner haben will. Im IE geht das auch wunderbar, aber im Firefox habe ich immer zwischen oberem Rand und Div-Anfang ein freies Stück.
An was kann das liegen?
An der Voreinstellung des Werts für die 'margin'-Eigenschaft des 'p'-Elements.
Hier der Link:
http://www.baumanagement-babilon.de/
Das ist kein Link. Das ist einer: http://forum.de.selfhtml.org/hilfe/bedienung.htm#verweise-einbinden
<body style="font-family: arial; background-color: #FBFBFF; background-image: url('hg.gif'); background-attachment: fixed; margin:0px; line-height:200%; border:0;">
Pfui inline-Styles! [</archiv/2006/8/t134850/#m875140>, </archiv/2006/8/t134910/#m875774>]
<p align="center">Projektmanagement Projektsteuerung Facility
Management Consulting Bauherrenberatung
Wenn mehr als ein '
' hintereinander auftaucht, machst du etwas falsch. Abstände erzeugst du mit CSS.
See ya up the road,
Gunnar
An der Voreinstellung des Werts für die 'margin'-Eigenschaft des 'p'-Elements.
Aaah danke, das wars :-)
Hier der Link:
http://www.baumanagement-babilon.de/Das ist kein Link. Das ist einer: http://forum.de.selfhtml.org/hilfe/bedienung.htm#verweise-einbinden
<body style="font-family: arial; background-color: #FBFBFF; background-image: url('hg.gif'); background-attachment: fixed; margin:0px; line-height:200%; border:0;">
Pfui inline-Styles! [</archiv/2006/8/t134850/#m875140>, </archiv/2006/8/t134910/#m875774>]
Wäre nett, wenn nicht immer so abschätzige Kommentare kommen würden... ;-)
<p align="center">Projektmanagement Projektsteuerung Facility
Management Consulting BauherrenberatungWenn mehr als ein '
' hintereinander auftaucht, machst du etwas falsch. Abstände erzeugst du mit CSS.
Wie genau mach ich das (Ich bin immernoch quasi CSS-Anfänger)? Brauch ich da für jedes Wort n eigenes Div oder so?
Vielen Dank
Hans
Wenn mehr als ein '
' hintereinander auftaucht, machst du etwas falsch. Abstände erzeugst du mit CSS.
Wie genau mach ich das (Ich bin immernoch quasi CSS-Anfänger)? Brauch ich da für jedes Wort n eigenes Div oder so?
Naja, ein DIV wäre da eher fehl am Platz, wie bereits vorgeschlagen, sollte eine Liste die erste Wahl sein. Und wenn es um Navigationslisten geht, verlinke ich immer wieder gern auf http://css.maxdesign.com.au/listamatic/ (Warum das Rad neu erfinden?)
Siechfred
ich habe das Problem, dass ich ein Div-Element einfach oben wie ein Banner haben will. Im IE geht das auch wunderbar, aber im Firefox habe ich immer zwischen oberem Rand und Div-Anfang ein freies Stück.
An was kann das liegen?
Außenabstände werden zusammengezogen, und zwar so, dass der größte gewünschte Abstand bleibt (du kannst nebenbei bemerkt davon ausgehen, dass der IE es falsch macht, auch wenn's das passiert, was du möchtest). Daher:
<div style="margin:0; padding:0; …">
<p align="center">
Der Abstand, der dich stört, stammt vom <p>-Element.
Davon unabhängig macht es nicht allzu viel Sinn, ein <p> auf diese Weise in ein <div> zu stecken. Schmeiß' das <div> raus und formatiere das <p>-Element, das Ergebnis wird das Gleiche sein (ohne Abstand, da dann <p> mit margin=0).
Weiterhin sollten sich Arien à la
Projektmanagement Projektsteuerung
durch Angabe eines Seitenabstands vermeiden lassen.
Verwendest Du statt des <p> bzw. <div> eine <ul>/<li>-Kombination, hättest du auch gleich eine feine Möglichkeit, diesen Seitenabstand sinnvoll (also ohne <span>) unterzubringen.
Das sähe dann ungefähr so aus:
<style type="text/css">
ul {
text-align:center;
margin:0;
padding:0;
background: rgb(63, 63, 159); color:white;
line-height: 300%;
font-size: 110%"
}
li {
display:inline;
padding:0 1em;
margin:0;
list-style:none;
}
</style>
[…]
<ul>
<li>Projektmanagement</li>
<li>Projektsteuerung</li>
<li>Facility Management</li>
<li>Consulting</li>
<li>Bauherrenberatung</li>
</ul>
Schön, oder?
Wunderbar :-)
Da werden die Fragen während man sie stellt an der anderen Stelle schon beantwortet :-)
Danke!