Ajutor CSS

[alexer13]

lucrez la un site si am intampinat aceeasi problema.. pe o rezolutie de 1920x1080 se vede aliniat la stanga

Codul css

* [COLOR="#FFD700"]{ padding: 0; margin: 0; }

body {
   font-family: Arial, Helvetica, sans-serif;
     font-size: 14px;
	 background-color:#000;
     margin:0 auto;
     width:100%;
}


#logo{
     margin-top: 25px;
	 margin-left: 95px;
	 width:400;
	 height: 120;

}

#reclama{
     position:absolute;
     margin-left: 465px;
	 margin-top: -100px;
	 width:728px;
	 height: 90px;
}

#zonam{
     float:left;
     margin: 0px 0px 0px 130px;
	 width: 1075px;
	 height: 50px;
	 background-image:url("resurse/bg-meniu.png");
	 border-radius: 10px;
     box-shadow: 0 0 1px #888;
}



#meniu ul {
font-size:16px;
font-family: Arial;
margin: 15px 0px 0px 10px;
padding: 3 px;
font-weight: bold;
list-style-type: none;
list-style-image: none;

}
#meniu li {
margin: 7px;
display: inline;
}
#meniu a {
text-decoration:none;
color: #fff;
}
#meniu a:hover {
color: #000;
}

#continut{
     float:left;
	 margin: 10px 0px 18px 130px;
	 width: 810px;
	 height: auto;

	 background-color: #fff;
	 border-radius: 5px;
     box-shadow: 0 0 1px #888;
}

#continut p  {
     text-align:center;
}

#bara{
     position:absolute;
     margin: 61px 0px 0px 950px;
	 width: 250px;
	 height: auto;
	 background-color: #fff;
	border-radius: 5px;

}

#bara2{
     margin: 260px 0px 0px 950px;
	 width: 250px;
	 height: auto;
	 background-color: #fff;
	border-radius: 5px;

}

#bara3{
     margin: 290px 0px 0px 950px;
	 width: 250px;
	 height: auto;
	 background-color: #fff;
	border-radius: 5px;

}

#formular{
      float:left;
	  width: 650px;
	  height: 500 px;
	  margin: 5px 3px 5px 10px;
}

#bara h2 .bar{
     text-align:center;
}

#bara p.bar2{
     text-align:center;
	 font-weight: bold;

}[/COLOR]

[AlStar]

Trebuie un wrapper principal cu latime exacta (adica in px nu in %) - ori body-ul ori in interior (nu mai stiu exact). Dupa ce i-ai dat latime fixa - dai centrare

[Sim Master]

De multe ori tagul <center> isi face treaba, doar ca e cam neprofesional. E bun pentru o solutie temporara, pana ii dai de cap prin css.

[AlStar]

center-u' sa inglobeze div-uri? Sunt foarte sigur ca nu prea-si face treaba. Pai ori e la fel pe toate browserele si rezolutiile (mai mari de x*y )..ori nu mai e?

[Arrmaghedon]

Dai la body un width anume si incearca cu linia position: relative; in body.

[Sim Master]

Sau alt exemplu ar fi ca body-ul sa fie 50%, iar in css sa pui margin-left:25%. In felul asta o sa fie mereu in aceeasi pozitie doar ca body-ul se va mari sau micsora in functie de rezolutie.

[mihai_tgv]

in loc de body { ... } scrie asta:

.body { background: #000000; padding:0; margin:0;}
.body_resize {background: #000000; width:960px; margin:0 auto; padding:0;}

si imediat dupa <div class="body"> baga un <div class="body_resize">.Incearca si vezi daca merge.

[Xander]

rezolvarea este de obicei foarte simpla ... dar pentru ca nu ai dat html deloc e greu sa te ajutam calumea... o chestie care ar putea sa mearga dupa cum ai structurat css-u.. incearca:

body > * { margin: 0 auto; float: none; display: block; }

chiar daca merge... nu e frumos daca vrei sa iti zic exact cum sa faci pune cel putin primul nivel de nesting din body ca sa pot sa iti zic exact ce css sa pui

[robertutzu]

wrapper peste mai mare si margin:0 auto; se va autocentra

[StrXt]

* {
    margin: 0;
    padding: 0;
}

#wrapper {
    margin: 0 auto;
    width: 900px;
}

Seteaza latimea template-ului si pune tot ce ai tu acolo intr-un div cu id-ul wrapper.

[fimoza85]

<style type="text/css">
div#container
{
	position:relative;
	width: 1190px;
	margin-top: 0px;
	margin-left: auto;
	margin-right: auto;
	text-align:left; 
}
body {text-align:center;margin:0}
</style>

[alexer13]

am asa:

* {

margin: 0;

padding: 0;

}

body {

font-family: Arial, Helvetica, sans-serif;

font-size: 14px;

background-color:#000;

margin:0 auto;

width:100%;

}

#wrapper {

width: 1000px;

margin-top: 0px;

margin-left: auto;

margin-right: auto;

}

si acum e pe dreapta mai mult

Edited July 23, 2012 by alexer13

[robertutzu]

incearca

* {
margin: 0;
padding: 0;
}
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
background-color:#000;
width:auto!important;
}

#wrapper {
width: 1000px;
margin-left: auto;
margin-right: auto;
top:0;
}

[Xander]

pune ba omule htmlu daca vrei sa faci corect

[alexer13]

Va multumesc tuturor care au postat.

Am rezolvat problema. Dupa ce am setat:

body {

font-family: Arial, Helvetica, sans-serif;

font-size: 14px;

background-image:url("resurse/bgsus.png");

background-repeat:no-repeat;

background-position:top;

background-color:#000;

margin:0 auto;

width:100%;

text-align:center;margin:0

}

#wrapper {

position:relative;

width: 1190px;

margin-top: 0px;

margin-left: auto;

margin-right: auto;

text-align:left;

}

Trebuia sa setez iar margin-left la celelalte elemente.

[Pacalici]

body {

font-family: Arial, Helvetica, sans-serif;

font-size: 14px;

background-image:url("resurse/bgsus.png");

background-repeat:no-repeat;

background-position:top;

background-color:#000;

margin:0 auto;

width:100%;

text-align:center;margin:0

}

background position ar trebui sa aiba doua valori. Acum nu iti strica nimic, dar in alte cazuri s-ar putea.

De ex: background-position: x y; ( ca si unitate poti avea px, em, % sau left,top,bottom,middle,center, right ).