CSS Verständnisfrage

[RWarnecke]

Hallo zusammen,

ich muss gerade eine Webseite entwerfen. Dabei habe ich folgendes Problem. Ich verwende das folgende CSS-Skript :

Code:

.frame_top
{
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 9px;
   
      background-color: #ffffff;
      padding-top: 6px;
      padding-bottom: 6px;
      padding-left: 6px;
      padding-right: 6px;
      vertical-align: top;
      
      border-top-width: 10px;
      border-bottom-width: 10px;
      border-left-width: 10px;
      border-right-width: 10px;
   
      border-top-style: inset;
      border-bottom-style: outset;
      border-left-style: inset;
      border-right-style: outset;

      border-top-color: #00FF00;
      border-bottom-color: #00FF00;   
      border-left-color: #00FF00;
      border-right-color: #00FF00;
}

Wenn ich .frame_top als Class in einer Tabelle angebe, habe ich unterschiedliche Ansichten des Rahmens unter FF, IE8, Opera und Chrome. Was muss ich da Ändern und warum ?

[hs-y]

Hey,

also zunächst einmal: Warum veränderst du die Angaben nicht so, dass du hast:
padding: 6px;

Da dieser Eintrag ja für alle Seiten gleich ist. Das gleiche gilt auch für die Farbe.

Wahrscheinlich liegt dein Problem daran, dass die Browser alle immer ncoh nciht den Acid Test bestehen. Heißt du musst vermutlcih spezielle Hacks fr die jeweiligen Browser anwenden.

[mirage228]

Ist die Font-Größe von "9px" wirklich so gewollt? Soweit ich weiß sollte man eher "pt" (oder "em" :gruebel: ) verwenden....

[jaenicke]

Die Frage ist doch vor allem: Welche Ansicht ist denn die, die du haben möchtest?

Denn ich meine inset links und oben und outset rechts und unten führt schließlich normalerweise zu einem normalen einfarbigen Rahmen...
Denn inset dunkelt links und oben ab und outset rechts und unten.

// EDIT:
Wobei beim IE dies zweistufig erfolgt. Was aber auch normalerweise ganz gut ist, wenn man nicht gerade einen so breiten Rahmen nimmt.

[RWarnecke]

Zitat:

Zitat von mirage228

Ist die Font-Größe von "9px" wirklich so gewollt? Soweit ich weiß sollte man eher "pt" (oder "em" :gruebel: ) verwenden....

Ich habe gestern Abend nur mal ein Tutorial zu CSS durchgelesen und ausprobiert. Da stand für die Fontgröße etwas von Pixel drin. Deshalb steht "px" als Größenangabe in dem Beispiel.

Zitat:

Zitat von jaenicke

Die Frage ist doch vor allem: Welche Ansicht ist denn die, die du haben möchtest?

Hallo Sebastian, ich möchte in alle Browser die gleiche Ansicht haben. Eine einfarbigen Rahmen und nicht so abgestuft wie im IE. Hinzukommt ja noch, dass die angegebene Farbe im Opera heller ist als im Firefox. Irgendiwe werde ich noch nicht so richtig warm mit CSS-Styles.

[quendolineDD]

Einfarbige Rahmen mache ich durch borders.

[jfheins]

Probiers mal so:

Code:

.frame_top 
{ 
      font-family: Verdana, Arial, Helvetica, sans-serif; 
      font-size: 12pt; 
    
      background-color: #ffffff; 
      padding: 6px; 
      vertical-align: top; 
      
      border: 4px solid #00FF00;
}

Das mit den unterschiedlichen Farben dürfte an dem inset/outset gelegen haben.
Außerdem habe ich die padding und die border Deklarationen *etwas* gekürzt ;)

[jaenicke]

Richtig, inset und outset ist dafür gedacht, dass man einen Buttoneffekt hat. Und das wird im IE eben zweistufig für einen besseren 3D-Effekt gemacht. Für einen normalen einfarbigen Rahmen ist das natürlich nicht gedacht.

// EDIT:
Vielleicht hilft das ja beim Verständnis:
http://www.tizag.com/cssT/border.php

[RWarnecke]

@jfheins
Danke, Dein Beispiel hat genau das Erbracht, was ich wollte.

@jaenicke
Ich werde mir den Link ansehen und mit den Werten mal ein bisschen rumspielen.

Danke nochmals an alle für Ihre Hilfe.