Rózne rozmiary pod IE a Firefox [css]

[robert8005]

Witam serdecznie!
Trochę przeglądam forum i postanowiłem opisać moje problemy z rozwiązaniem pewnego przypadku w css, ponieważ nie znalazłem.


Chodzi o to że jak zrobię div z ramką 1px o szerokości 760px, to pod Firefox ma ona 762px, a marginesy po 1px - więc w środku zostaje 760px.

W ie natomiast cała ma 760px, marginesy po 1px - więc tu w środku zostaje już tylko 758px.

Dlaczego tak jest i jak to należy rozwiązać ?

[koziolek]

Podstawowy problem z zakresu css

piszemy css:

Kod: Zaznacz cały

/*dla FF*/
.content{
width: 758px;
border: 1px solid #abc;
}
/*dla IE*/
* body .content{
width: 760px;
}

taki wpis powinien rozwiązać problem

[robert8005]

A możesz to umieścić poprawnie w tym kodzie?

Kod: Zaznacz cały

*  #strona {
      margin : auto;
      border : 1px solid black;
      padding : 0;
      width : 760px;
      background : rgb(255, 255, 0);
      }
    * #naglowek {
      margin : auto;
          border:0;
          padding : 0;
           background : rgb(255, 0, 0);
      }
    * #kolumnaLewa {
           margin : auto;
           border:0;
           padding : 0;
          width : 180px;
           clear : none;
           float : left;
           background : rgb(0, 255, 0);
      }
    * #kolumnaPrawa {
           margin : auto;
           border:0;
           padding:0;
           width: 580;
           height: 200;
           clear : none;
           float : right;
           background : rgb(0, 0, 255);
      }
    * #stopka {
           margin : auto;
           border        : none;
           padding     : 0px;
           height: 40;
           clear : both;
           background : rgb(0, 255, 255);
      }

i dzięki

[koziolek]

Kod: Zaznacz cały

*  #strona {
      margin : auto;
      border : 1px solid black;
      padding : 0;
      width : 758px;
      background : rgb(255, 255, 0);
      }
* html #strona {
      margin : auto;
      border : 1px solid black;
      padding : 0;
      width : 760px;
      background : rgb(255, 255, 0);
      }

w ten sposób

[robert8005]

Acha. O.K.
Bo tam wcześniej było z kropką i nie wiedziałem.
Ale znalazłem jeszcze:

Kod: Zaznacz cały

* #strona {
      margin : auto;
      border:1px solid;
      border-radius: 10px;
      padding : 0;
      width : 758px !important;
      width : 760px;
      background : rgb(255, 255, 0);
      }

Chyba będzie prościej co ?

[koziolek]

obie wersje działają ale ta z important nie ruszy pod IE7

Kod: Zaznacz cały

*  #strona {
      margin : auto;
      border : 1px solid black;
      padding : 0;
      width : 758px;
      background : rgb(255, 255, 0);
      }
* html #strona {
      margin : auto;
      border : 1px solid black;
      padding : 0;
      width : 760px;
      background : rgb(255, 255, 0);
      } 

Można jeszcze uprościć:

Kod: Zaznacz cały

*  #strona {
      margin : auto;
      border : 1px solid black;
      padding : 0;
      width : 758px;
      background : rgb(255, 255, 0);
      }
* html #strona {
      width : 760px;
} 

[robert8005]

no to bardzo dzięki