центриране при различни резолюций

mario_gangstera

Registered
значи в сайта ми (http://muzika.us.to) като се влезе в резолюция 1024/768 всичко си е ОК , а при по голяма рез. се размества целия сайт.. казаха ми че се оправяло с някакво repeat в .css файл но нз как. Ще може ли някой да ми помогне? ето всички .css-a които имам:

style.css
BODY{
background-color: #FFFFFF;
margin-left: auto;
margin-right: auto; background-image:url('images/bg.png'); background-attachment:fixed
}
BODY, TD, TH, TR{
color: #000;
font-size: 8pt;
font-family: verdana, sans-serif;
}
.fileThumb
{
background-position:center;
background-image: url();
border: 1px solid #B8B8B8;
/* background-color:#fff; */
width: 100px;
height: 75px;
border:0;
}

#tagcloud1
{
background:#FFCCFF;
color:#0066FF;
padding: 10px;
border: 2px solid #FFE7B6;
text-align:center;

}
#tagcloud1 a:hover
{
background:#FFCC66;

}
#tagcloud2
{
background:#FFCC66;
color:#0066FF;
padding: 10px;
border: 1px solid #FFE7B6;
text-align:center;
margin: 10px 0;

}
#tagcloud2 a:hover
{
background:#FFCCFF;

}
#tagcloud3
{
background:#CCCC66;
color:#0066FF;
padding: 10px;
border: 1px solid #FFE7B6;
text-align:center;

}
#tagcloud3 a:hover
{
background:#FFCC66;

}

.digg {
font-size: 200%;
font: sans-serif;
background: #FBFBFB;
border: 1px solid #CDCDCD;
color: #000524;
padding: 1px;
}
A:link {text-decoration: none; color: #454444;}
A:visited {text-decoration: none; color: #000000;}
A:active {text-decoration: none; color: #3b3b36;}
A:hover {text-decoration: none; color: #09b74;}


hr {
border: 0;
color: #B9B9B9;
background-color: #B9B9B9;
height: 1px;
}

table {

border-collapse:collapse;
}

#replacement-2 {
width: 78px;
height: 32px;
padding: 0px 0 0;
margin: 0;
border: 0;
background: transparent url(http://gimado.com/images/searchgimado.png) no-repeat ;
overflow: hidden;
cursor: pointer; /* hand-shaped cursor */
cursor: hand; /* for IE 5.x */
}
form>#replacement-2 { /* For non-IE browsers*/
height: 0px;
}
------------------------

style/style.css
FONT {FONT-FAMILY: Verdana,Helvetica; FONT-SIZE: 10px}
TD {FONT-FAMILY: Verdana,Helvetica; FONT-SIZE: 10px}
BODY {FONT-FAMILY: Verdana,Helvetica; FONT-SIZE: 10px;color:#fefefe;background:#051c00 url(../images/bg.jpg) center top repeat-y;}
P {FONT-FAMILY: Verdana,Helvetica; FONT-SIZE: 10px}
DIV {FONT-FAMILY: Verdana,Helvetica; FONT-SIZE: 10px}
INPUT {FONT-FAMILY: Verdana,Helvetica; FONT-SIZE: 10px}
TEXTAREA {FONT-FAMILY: Verdana,Helvetica; FONT-SIZE: 10px}
FORM {FONT-FAMILY: Verdana,Helvetica; FONT-SIZE: 10px}
A:link {BACKGROUND: none; COLOR: #cccccc; FONT-SIZE: 10px; FONT-FAMILY: Verdana, Helvetica; TEXT-DECORATION: none}
A:active {BACKGROUND: none; COLOR: #eb0000; FONT-SIZE: 10px; FONT-FAMILY: Verdana, Helvetica; TEXT-DECORATION: none}
A:visited {BACKGROUND: none; COLOR: #7f7f7f; FONT-SIZE: 10px; FONT-FAMILY: Verdana, Helvetica; TEXT-DECORATION: none}
A:hover {BACKGROUND: none; COLOR: #cccccc; FONT-SIZE: 10px; FONT-FAMILY: Verdana, Helvetica; TEXT-DECORATION: underline}
.title {BACKGROUND: none; COLOR: #fefefe; FONT-SIZE: 11px; FONT-WEIGHT: bold; FONT-FAMILY: Verdana, Helvetica; TEXT-DECORATION: none}
.content {BACKGROUND: none; COLOR: #cdcdcd; FONT-SIZE: 10px; FONT-FAMILY: Verdana, Helvetica}
.storytitle {BACKGROUND: none; COLOR: #cdcdcd; FONT-SIZE: 12px; FONT-WEIGHT: bold; FONT-FAMILY: Verdana, Helvetica; TEXT-DECORATION: none}
.storycat {BACKGROUND: none; COLOR: #cdcdcd; FONT-SIZE: 11px; FONT-WEIGHT: bold; FONT-FAMILY: Verdana, Helvetica; TEXT-DECORATION: underline}
.boxtitle {BACKGROUND: none; COLOR: #cdcdcd; FONT-SIZE: 10px; FONT-WEIGHT: bold; FONT-FAMILY: Verdana, Helvetica; TEXT-DECORATION: none}
.boxcontent {BACKGROUND: none; COLOR: #fefefe; FONT-SIZE: 11px; FONT-FAMILY: Verdana, Helvetica}
.option {BACKGROUND: none; COLOR: #cdcdcd; FONT-SIZE: 11px; FONT-WEIGHT: bold; FONT-FAMILY: Verdana, Helvetica; TEXT-DECORATION: none}
.tiny {BACKGROUND: none; COLOR: #cdcdcd; FONT-SIZE: 10px; FONT-WEIGHT: normal; FONT-FAMILY: Verdana, Helvetica; TEXT-DECORATION: none}
.footmsg {BACKGROUND: none; COLOR: #cdcdcd; FONT-SIZE: 10px; FONT-WEIGHT: normal; FONT-FAMILY: Verdana, Helvetica; TEXT-DECORATION: none}
.footmsg_l {BACKGROUND: none; COLOR: #cdcdcd; FONT-SIZE: 10px; FONT-WEIGHT: normal; FONT-FAMILY: Verdana, Helvetica; TEXT-DECORATION: underline}
.box {FONT-FAMILY: Verdana,Helvetica; FONT-SIZE: 10px; border: 1px solid #CCCCCC; background-color: #ccc}
i { color:#fefefe;}
/* -------------------------- */
a.sgfooter:link, a.sgfooter:visited {
color : #fefefe;
font-size : 10px;
font-family: Arial;
text-decoration:none;
}
a.sgfooter:hover {
color : #fefefe;
font-family: Arial;
text-decoration:none;
}
a.sgfooter1:link, a.sgfooter1:visited {
color : #336699;
font-size : 10px;
font-family: Verdana,Arial,Helvetica,sans-serif;
text-decoration:none;
}
a.sgfooter1:hover {
color : #336699;
font-family: Verdana,Arial,Helvetica,sans-serif;
text-decoration:none;
}
.sgf {
font-size: 10px;
font-family: Verdana,Arial,Helvetica,sans-serif;
color: #fefefe;
text-decoration:none;
}
.sgf1 {
font-size: 10px;
font-family: Verdana,Arial,Helvetica,sans-serif;
color: #fefefe;
text-align:left;
}

.sgimg1{
background:#0072b5 url(../images/banner_01.jpg) center top no-repeat;
background-repeat: no-repeat;
width:28px;
height:16px;
}
.sgimg2{
background:#0072b5 url(../images/banner_02.jpg) center top no-repeat;
background-repeat: no-repeat;
width:107px;
height:16px;
}

----------------------------------

editor_ui.css
.mceButtonNormal, .mceButtonOver, .mceButtonDown, .mceSeparator, .mceButtonDisabled, .mceButtonSelected {
margin-top: 1px;
margin-left: 1px;
}

.mceButtonNormal {
border-top: 1px solid;
border-left: 1px solid;
border-bottom: 1px solid;
border-right: 1px solid;
border-color: #F0F0EE;
cursor: arrow;
}

.mceButtonOver {
/* border-top: 1px solid buttonhighlight;
border-left: 1px solid buttonhighlight;
border-bottom: 1px solid buttonshadow;
border-right: 1px solid buttonshadow;*/
border: 1px solid #0A246A;
cursor: arrow;
background-color: #B6BDD2;
}

.mceButtonDown {
/* border-bottom: 1px solid buttonhighlight;
border-right: 1px solid buttonhighlight;
border-top: 1px solid buttonshadow;
border-left: 1px solid buttonshadow;*/
cursor: arrow;
border: 1px solid #0A246A;
background-color: #8592B5;
}

.mceButtonDisabled {
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=30);
border-top: 1px solid;
border-left: 1px solid;
border-bottom: 1px solid;
border-right: 1px solid;
border-color: #F0F0EE;
cursor: arrow;
}

.mceSeparator {
border-top: 1px solid buttonhighlight;
border-left: 1px solid buttonhighlight;
border-bottom: 1px solid buttonshadow;
border-right: 1px solid buttonshadow;
margin-right: 2px;
margin-left: 2px;
}

.mceSeparatorLine {
margin:2px;
margin-left: 4px;
background-color: #F0F0EE;
border-top: 1px solid buttonshadow;
border-left: 1px solid buttonshadow;
border-bottom: 1px solid buttonhighlight;
border-right: 1px solid buttonhighlight;
width: 0px;
height: 15px;
}

.mceSelectList {
font-family: "MS Sans Serif";
font-size: 7pt;
font-weight: normal;
margin-top: 2px;
}

.mceLabel, .mceLabelDisabled {
font-family: "MS Sans Serif";
font-size: 9pt;
}

.mceLabel {
color: #000000;
}

.mceLabelDisabled {
cursor: text;
color: #999999;
}

.mceEditor {
background: #F0F0EE;
border: 1px solid #cccccc;
}

.mceEditorArea {
font-family: "MS Sans Serif";
background: #FFFFFF;
}

.mceToolbar {
background: #F0F0EE;
border-top: 1px solid #cccccc;
}
 
И аз имам същия проблем!
Искам да може като се отвори на по-голяма резолюция пак сайта да не се разбутва(а става точно това)
 
Слагате си цялата информация в един главен DIV и го позиционирате, а след това всички елементи вътре ги позиционирате смрямо DIV-a
 
както каза @vankich правите примерно div#container и ако искате да е широк 1024 px сайта ви просто на дива му задавате тази широчина, като наблъсквате цялото съдържание на сайта в този див контейнер (примерно име, не е задължително да се казва container) и му задавате на дива margin: auto; или пък margin-left: auto; margin-right: auto; и така той ше се центрира на екрана :)
 

Back
Горе