સ્થિર પહોળાઈ લેઆઉટ સાથે એક દસ્તાવેજ કેન્દ્રિત કરવા માટે CSS નો ઉપયોગ કરો

સ્થિર પહોળાઈ લેઆઉટ ત્યાં બહાર કેટલાક લોકપ્રિય બ્રાઉઝર્સ સાથે કેન્દ્રિત કરવા માટે મુશ્કેલ હોઈ શકે છે, પરંતુ શક્ય છે, ફક્ત કોડની થોડી રેખાઓ સાથે.

અહીં કેવી રીતે

  1. તમારા HTML સંપાદકમાં CSS સ્ટાઇલશીટ સાથે નવું વેબ પૃષ્ઠ બનાવો
  2. પૃષ્ઠ પર મુખ્ય તત્વ તરીકે એક DIV ઘટક બનાવો જ્યાં તમે પૃષ્ઠ પર બધું સંગ્રહિત કરશો.
  3. તે div તત્વને એક ID આપો જે પૃષ્ઠ પર અનન્ય છે.
  4. તમારી સીએસએસ શૈલી પત્રક ખોલો અને તમારા DIV ઘટકની પહોળાઈ સેટ કરો. div # મુખ્ય {પહોળાઈ: 750px; }
  5. તમારા DIV ને મધ્યમાં આપોઆપ માર્જિન ઉમેરો div # મુખ્ય {પહોળાઈ: 750px; માર્જિન ડાબે: ઑટો; માર્જીન-જમણા: ઓટો}
  6. નેટસ્કેપ 4 માટે તેને ઠીક કરવા માટે, અને IE 4-6 ( શ્વસન મોડ ) શરીર પર ટેક્સ્ટ-સંરેખિત ઉમેરો. શરીર {ટેક્સ્ટ-સંરેખિત: કેન્દ્ર; }
  7. પરંતુ તે પછી તમામ ટેક્સ્ટ કેન્દ્રિત થાય છે, તેથી ટેક્સ્ટ-સંરેખિત ઉમેરીને તમારા # મુખ્ય પૃષ્ઠમાં ટેક્સ્ટ ફરીથી ગોઠવો: ડાબે; ત્યાં div # મુખ્ય {પહોળાઈ: 750px; માર્જિન ડાબે: ઑટો; માર્જિન-જમણે: ઓટો; ટેક્સ્ટ-સંરેખિત: ડાબે; }
  8. તમારું પૃષ્ઠ અને તમારી શૈલી શીટ સાચવો
  9. કેટલાક વેબ બ્રાઉઝરોમાં પરીક્ષણ કરો.

ટિપ

આ લેઆઉટ બોક્સને કેન્દ્રિત કરશે પરંતુ તેની અંદરની સામગ્રી નહીં. આંતરિક સામગ્રીને કેન્દ્રમાં લાવવા માટે ટેક્સ્ટ-સંરેખિતાનો ઉપયોગ કરો.