Width

Width blok və ya onu əvəz edən elementlərin (məsələn <img> elementi) enini təyin edir. Bu ölçüyə blok kənarlarındakı border'lərin qalınlığı, boşluqlar (padding) daxil deyil.
 
Quruluşu: width: <dəyər>
Aldığı dəyərlər: uzunluq dəyəri | faiz dəyəri | auto | inherit
Başlanğıc dəyəri: auto
Tətbiq oluna bilən elementlər: Blok elementlər
İrsilik: Yoxdur
 
CSS-də qəbul edilmiş istənilən uzunluq vahidləri width üçün təyin oluna bilər, məsələn piksel (px), düym (in) və s.
Faiz dəyərindən istifadə zamanı ölçü həmin elementin valideyn (üst) elementinin enindən asılı olaraq hesablanır. Tutaq ki, üst elementin ölçüsü 200 pikseldir. Əgər uşaq elementə width olaraq 50% ölçü verilərsə, həmin elementin eni 100 piksel olacaqdır. Əgər üst element və ya ölçüsü yoxdursa, bu zaman brauzerin pəncərəsinin ölçüsünə görə hesablanır

auto - Tipə və elementin tərkibinə əsaslanaraq eni qurur.
inherit - Valideyn elementin dəyərini alır
 
Nümunəyə baxaq:
<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>width</title>
  <style>
   .layer1 {
    width: 300px; /* Blokun eni */
    background: #fc0;
    padding: 7px;
    border: 1px solid #ccc;
   }
   .layer2 {
    width: 400px; /* Mətn blokunun eni */
   }
  </style>
 </head>
 <body>
  <div class="layer1">
   <p class="layer2">Lorem ipsum dolor sit amet,consectetuer 
   adipiscing elit,seddiem nonummy nibh euismod tincidunt ut 
   lacreet dolore magna aliguam erat volutpat.</p>
  </div>
 </body>
</html>
 
Brauzerdə nəticə belə görünəcəkdir.

Width

 
Göründüyü kimi,  fon rəngi verdiyimiz blokun ölçüsünü 300 piksel etdik, yazı blokuna isə ölçünü 400 piksel olaraq təyin etdik.
Nəticəyə bu linkdən də baxa bilərsiniz
CSS3