Iată câteva exemple de centrare orizontală a blocului din pagină. Prin utilizarea "margin: 0 auto;" și utilizând marje negative.
Cu marjă: 0 auto;
Blocul este centrat prin stabilirea dimensiunilor marginii din dreapta și din stânga la "auto". Aceasta este o modalitate foarte bună de a centra pe orizontală blocul folosind CSS. Acesta funcționează excelent în majoritatea browserelor care suportă CSS2. Dar IE5 / Win nu va răspunde la această caracteristică, este lipsa unui browser, nu a unei tehnici tehnice.
Este ușor pentru a obține în jurul valorii de - IE5 / Win se aplică în mod incorect de proprietate „text-align“ pentru a bloca la nivel de elemente. Declarați „text-align: center“ element în centrul de unitate (cel mai adesea corp) și problema pentru IE5 / Win pare a fi rezolvate. Un efect secundar al acestui truc - moștenirea proprietăților „text-align“ pentru inline-conținut. Centrați unitatea este acum declara „text-align: stânga“ și, astfel, să prezinte aspectul în ordine.
De exemplu, centrarea unui bloc folosind "margin: 0 auto;".
Utilizând o valoare a marjei negative
Mai întâi, plasați marginea din stânga a blocului, centrat cu "poziție: absolută; stânga: 50%;". Apoi setați marginea din stânga la jumătate din lățimea blocului și faceți-o negativă: "margin-left: -266px;" .
De exemplu, centrarea unui bloc folosind "margin: -100px;".
Dimensiunile blocului nu trebuie să fie fixate. Puteți să le setați în procente, dar cu aceeași condiție pentru "margin-left" atunci codul va fi:
De exemplu, centrarea unui bloc folosind "marja: -20%;".
Folosind exemplele de mai sus și modificând valorile marginilor din stânga și din dreapta, nu puteți plasa blocul strict în centru, ci mutați-l spre dreapta sau spre stânga centrului.
Mă întreb cum să centrez masa dacă nu are o lățime fixă și procentaj?
Începeți să înnobilați codul site-ului dvs. Traduceți-o în div-uri, simplificați, optimizați.
Jumătate de zi a fost făcută cu centrarea imaginii :)
A fost complet inadmisibil să o încheiem într-un div! A fost un img normal. care trebuia să se afle în centrul documentului.
text-align: centru nu a fost aplicat la acesta.
aliniere orizontală - de asemenea, nu.
aliniere - nr.
Am încercat o grămadă de opțiuni, DOCTYPE diferite ...
În cele din urmă, spat, încheiat în ... :)
Dar nu a vrut să producă entități inutile!
Sunt cu toții la faptul că această etichetă se centrează. Și asta e :) Nu este nevoie de CSS pentru asta.
2Victor Gr .:
dacă imaginea, să zicem, este înăuntru
atunci scriem în stilul css
div # centru img
iar imaginea este centrat.
void, nu funcționează
24, mulțumesc, trece acum validarea.
Pentru cei care nu au observat - nu a existat nici un element FIELDSET și forma (eticheta, de intrare ...) au fost în formă, precum și un larg atârnat un element de bloc. Ca document pagina XHTML1.1 nu trece de validare.
Puteți specifica imediat relativ. în loc să o împachetezi absolut.
Sub standardul XHTML 1.1, opțiunea cu margine: aplicată automat la tabele nu a fost rulată))), dar a fost doar aspectul tabelului. A inventat acest lucru:
Celulele exterioare nu au valori date, iar lățimea tabelului este de 100% centrarea este realizată prin extinderea celulelor din stânga și din dreapta la valorile dorite. Cross-browser, valabil, acceptă atât procentajul, cât și lățimea fixă.
La naiba, codul nu a apărut. Apoi, din nou, aplicarea entităților, în loc de paranteze unghiulare:
| style = "lățime: valoarea dorită în procente sau pixeli"> conținut |
cu centrare orizontală, nu totul este bun, în cazul unei lățimi fixe a blocului. Se deplasează dincolo de marginea din stânga a ecranului fără derulare, cu o dimensiune mică a ferestrei. cum aș face asta?
Și există o astfel de opțiune. Se creează un tarball, un rând și trei celule. Dreapta și stânga sunt setate la o lățime de 50%. Și cel central este fără dimensiuni. Și în măsura în care se umple, cele laterale se vor schimba simetric.
Bună ziua, cum pot centra meniul site-ului prin css? du-te la site-ul meu și veți înțelege!
Mulțumită în avans
Trimiteți-le prietenilor: