సిఎస్ఎస్ లేఆఉట్ వైడ్త్ అండ్ మాక్స్-వైడ్త్

వెడితం, max-width మరియు margin: auto ఉపయోగించడం

మున్నతి చూపండి అనుసారం, బ్లాక్ బ్లాక్ ఎలిమెంట్స్ ఎల్లప్పుడూ అందుబాటులో ఉన్న పూర్తి వెడితంను పాటిస్తాయి (ఎక్కువగా కుడికి మరియు ఎడమకి విస్తరించబడతాయి).

బ్లాక్ బ్లాక్ ఎలిమెంట్ సెట్ చేయడం వెడితం దాని కంటైనర్ అంచులకు విస్తరించకుండా చేస్తుంది. అప్పుడు, మీరు మార్జిన్ సెట్ చేయబడింది auto చేయవచ్చు ఎలిమెంట్ కంటైనర్ పరిధిలో హరిద్రాన్ని స్థాయిలో మీదట మధ్యలో కేంద్రీకరించడానికి. ఎలిమెంట్ ప్రస్తుతించిన వెడితను పాటిస్తుంది, మిగిలిన అంతరం రెండు మార్జిన్ల మధ్య సమానంగా విస్తరించబడుతుంది:

ఈ <div> ఎలిమెంట్ వెడితం 500px, మార్జిన్ సెట్ చేయబడింది auto.

మున్నతి చూపండి:బ్రౌజర్ విండో ఎలిమెంట్ వెడితను కంటే చిన్నది అయితే ఈ పైన ఉన్న <div> 会发生问题。浏览器会将水平滚动条添加到页面。

在这种情况下，使用 max-width 可以改善浏览器对小窗口的处理。为了使网站在小型设备上可用，这一点很重要：

这个
元素的最大宽度为 500px，外边距设置为 auto。

提示：బ్రౌజర్ విండో పరిమాణాన్ని 500 పిక్సెల్స్ కంటే చిన్నదిగా మార్చండి, రెండు div మధ్య తేడాను చూడండి!

ఈ పైన రెండు div యొక్క ఉదాహరణ ఈ కింద ఉంది:

ఉదాహరణ

div.ex1 {
  width: 500px;
  margin: auto;
  border: 3px solid #73AD21;
}
div.ex2 {
  max-width: 500px;
  margin: auto;
  border: 3px solid #73AD21;
}

స్వయంగా ప్రయత్నించండి