zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Prozentangaben & Padding in FireFox/Netscape

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 17.03.2005, 17:36
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 17.03.2005
Beiträge: 7
onliner befindet sich auf einem aufstrebenden Ast
Standard Prozentangaben & Padding in FireFox/Netscape

Hallo zusammen,

ich bin über einen Link CSS4You.de auf dieses Forum gestoßen, weil ich eine Frage zu meinen Stylesheets habe. Ich habe heute einen ersten Versuch in tabellenfreim Design gestartet, der auch - halbwegs - erfolgreich war.

Ich habe viele Fragen, also fange ich am besten von vorne an. Zuerst einmal habe ich das Problem, dass FireFox die Stylesheets komplett anders interpretiert als der IE. Das ist eigentlich nichts außergewöhnliches, außer das es mir dieses mal im IE logisch und im Firefox falsch vorkommt.

[Zum testen verwendete Browser: I.E. 6.0 - SP1, FireFox 1.1, Netscape 7.1]

Problem 1: Padding
Die Div's sind über "float: left;" und "...right;" angeordnet und haben eine feste Breite und Höhe. Lege ich für einen der Container den Wert "padding" fest, führt das in FireFox und Netscape aber dazu, dass der Container um denselben Wert breiter/höher wird und mein Design zerschossen wird. Ich muss den Padding-Wert von der Breite des DIVs abziehen. Im Internet Explorer wird der Wert nicht addiert und als Resultat eine "Lücke" sichtbar, was unschön ist. Hat jemand einen Tip?

Problem 2: Prozentangabe
Das zweite Problem ist die Angabe der Höhe in Prozent. Alle Container liegen in einem Hauptcontainer, der die Seite mit einer Outline (-> border: 1px; color:... etc.) umschließt. Die Höhe habe ich mit 100% angegeben. Das funktioniert im IE prima, doch im FF und Netscape hängt die Linie irgendwo quer in der Landschaft. Ich kann für die Linie aber keine absolute Angabe machen, da auf den Seiten (erstellt mit Typo3) News-Module platziert sind, die eine unbestimmte Länge haben. Mit einem TD gibt's diese Probleme nicht (so war es vorher), dieser wird mit dem Inhalt gestreckt. Dies ist aktuell das größte Problem, da das ganze Konzept nur funktioniert, wenn ich diese Aufgabe löse.

Die Seite findet Ihr unter folgendem Link:

http://www.cupz.de

Für jede Antwort bin ich dankbar. Bitte verzeiht mir Anfängerfehler, es ist wie gesagt der erste versuch ohnen Tabellen.

Viele Grüße und Danke,
Basti
__________________
Niemand hat das Recht, zu gehorchen
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 17.03.2005, 17:48
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 18.01.2005
Beiträge: 696
wahsaga befindet sich auf einem aufstrebenden Ast
Standard Re: Prozentangaben & FireFox/Netscape

Zitat:
Zitat von onliner
Zuerst einmal habe ich das Problem, dass FireFox die Stylesheets komplett anders interpretiert als der IE. Das ist eigentlich nichts außergewöhnliches, außer das es mir dieses mal im IE logisch und im Firefox falsch vorkommt.
wenn ich dann aber
Zitat:
#obenrechts {
width: 295px;
height: 20px;
border: 1px solid #313D27;
float: right;
padding-left: 5px;
margin-right:2px;
}
bin ich mir ziemlich sicher, dass dein verständnis vom box model ebenso verkehrt ist wie das vom IE, und dass der firefox mal wieder richtig liegt ...


also informiere dich bitte mal über das stichwort "box model", welche abweichungen der IE hierbei gewöhnlich zeigt, und auch über das stichwort "quirks mode" bzw. "doctype switching".
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 17.03.2005, 18:02
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 17.03.2005
Beiträge: 7
onliner befindet sich auf einem aufstrebenden Ast
Standard

Wie gesagt: falsch "vorkommt", "erster Versuch", etc. pp. Du brauchst mich deshalb nicht gleich anmachen. Ich habe nichts getan, außer Fragen zu stellen.

Ich werde die entsprechenden Begriffe mal nachschlagen/recherchieren. Danke für die Hinweise.

MfG,
Onliner
__________________
Niemand hat das Recht, zu gehorchen
Mit Zitat antworten
  #4 (permalink)  
Alt 17.03.2005, 18:25
Neuer Benutzer
neuer user
 
Registriert seit: 17.03.2005
Beiträge: 2
Frankie befindet sich auf einem aufstrebenden Ast
Standard

#outline {
width: 914px;
height: 100%;
border: 1px solid #313D27;
}

height:100% muß raus, siehe Problem auf der Hauptseite.
Mit Zitat antworten
  #5 (permalink)  
Alt 17.03.2005, 18:31
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 17.03.2005
Beiträge: 7
onliner befindet sich auf einem aufstrebenden Ast
Standard

Hi Frankie,

wenn ich die Höhenangabe herausnehme, hat der DIV eine (geschätzte) Höhe von 250pix, dafür aber im FF und NS gleich.
__________________
Niemand hat das Recht, zu gehorchen
Mit Zitat antworten
  #6 (permalink)  
Alt 17.03.2005, 18:37
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 18.01.2005
Beiträge: 696
wahsaga befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von onliner
Du brauchst mich deshalb nicht gleich anmachen.
war nicht meine absicht.

Zitat:
Ich habe nichts getan, außer Fragen zu stellen.
und ich nichts, außer diese zu beantworten - und darauf hinzuweisen, wo das problem liegt.


(so, und jetzt fehlt mir nur noch'n weiterer kommentar vom legman ...)
Mit Zitat antworten
  #7 (permalink)  
Alt 17.03.2005, 19:13
Neuer Benutzer
neuer user
 
Registriert seit: 09.12.2004
Beiträge: 14
Subhash befindet sich auf einem aufstrebenden Ast
Standard Re: Prozentangaben & Padding in FireFox/Netscape

Zitat:
Zitat von onliner
Für jede Antwort bin ich dankbar.
Tut mir leid, Kriegsspiele unterstütze ich nicht. Sonst gerne.
__________________
computer artwork by subhash
NEU: Photoshop Workshops
\"Bildmontage\" - Teil 1 gratis!
Mit Zitat antworten
  #8 (permalink)  
Alt 18.03.2005, 14:39
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 17.03.2005
Beiträge: 7
onliner befindet sich auf einem aufstrebenden Ast
Standard

@Subhash: NP, jeder hat seine Überzeugung.

@all: Also, Ich habe mir jetzt das Box-Modell durchgelesen und dabei festgestellt, dass der Bug mit der Darstellung im IE 6.0 behoben ist, solange man das Dokument ordentlich als Doctype kennzeichnet. Ich blicke jetzt auch, dass ich bei der Gesamtberechnung meiner Zeilen alles berechnen muss. Größe der Box + Padding + Margin + Border für jeden einzelnen Div. Meine Frage dazu:

Die Gesamtbreite der einzelnen Zeilen habe ich jetzt so angepasst, dass ich immer den Gesamtwert 913 erhalte. Diese hängen nun in einem Div, der wirklich nur als Container dient und in dem ich die Breite der Zeile angebe. Ist die breite dann identisch mit meiner Gesamtrechnung der enthaltenen Container oder muss ich noch einmal jeweils einen Pixel für den DIV selbst addieren, obwohl dieser keine Border, Innen- oder Außenabstände auweist?

<div> = width 913 oder 915?

<div>width 600 + Margin right 2 + Margin left 2 + padding-left 3 + border 1 = 608</div>
<div>width 300 + Margin right 0 + Margin left 2 + padding-left 2 + border 1 = 305</div>
(--> = 913)
</div>

<div>
<div>width 600 + Margin right 2 + Margin left 2 + padding-left 0 + border 0 = 604</div>
<div>width 300 + Margin right 0 + Margin left 2 + padding-left 5 + padding-right 1 + border 1 = 309</div>
(--> = 913)
</div>

<div>

<div>width 140 + Margin right 2 + Margin left 2 + padding-left 2 + border 1 = 147</div>
<div>width 650 + Margin right 0 + Margin left 2 + padding-left 5 + padding-right 5 + border 1 = 663</div>
<div>width 100 + Margin right 0 + Margin left 2 + padding-left 0 + border 1 = 103</div>
(--> = 913)

</div>

Greets,
Onliner

Sehr schmerzhaft klangen mir in diesem Sinne auch die Worte meiner Mathe-Lehrerin durch den Kopf: "Mathematik werden Sie irgendwann in Ihrem späteren Leben noch benötigen, denken Sie an mich". Nun, ich glaube jetzt es ist soweit...
__________________
Niemand hat das Recht, zu gehorchen
Mit Zitat antworten
  #9 (permalink)  
Alt 18.03.2005, 15:11
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 02.06.2003
Beiträge: 2.441
ulle befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
width 300 + Margin right 0 + Margin left 2 + padding-left 2 + border 1 = 305
width = 300
margin = 2 (links 2 / rechts 0)
padding = 2 (links 2 / rechts 0)
border = 2 (links 1 / rechts 1)

=> Summe 306
__________________
</ulle>
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 18.03.2005, 15:59
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 17.03.2005
Beiträge: 7
onliner befindet sich auf einem aufstrebenden Ast
Standard

"Doh"... Danke! Werd's gleich ändern.
__________________
Niemand hat das Recht, zu gehorchen
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Verschiebungen bei größerem Bildschirm seelefant CSS 4 28.07.2014 16:43
Navigation positionieren maybebabe CSS 4 08.04.2013 23:17
Dynamische Größen Killhunter CSS 0 14.05.2011 17:56
Problem mit CSS Style flo007 CSS 3 25.01.2009 18:08
Problem mit CSS in Joomla 1.5 noobilicius CSS 6 25.09.2008 21:24


Alle Zeitangaben in WEZ +2. Es ist jetzt 21:07 Uhr.