奇妙なことに、モバイルブラウザのdivを中央に配置する際に奇妙な問題が発生します。私のタイトルが言うように：通常のPCブラウザは問題なく動作します-nada problemo = Dですが、これらのモバイルデバイスでは、メインコンテンツ（ボタンセクションの下）が左側に固定されます。私は多くのことを試しました-ここでstackoverflowでも解決策を探しました-しかし、与えられたヒントは今のところ私を助けませんでした...私が中心に置くことができた最後のことはjQueryを使用することでした-しかし私はそれを中継したくありません。
ここにコードがあります：
<!DOCTYPE html>
<html>
<head>
<title>Website</title>
<link href="css/configcss.css" rel="stylesheet" type="text/css">
</head>
<body onLoad="MM_preloadImages('pictures/Layout/Button/homeo.png','pictures/Layout/Button/grafiko.png','pictures/Layout/Button/webo.png','pictures/Layout/Button/reklamo.png','pictures/Layout/Button/fotoo.png','pictures/Layout/Button/videoo.png','pictures/Layout/Button/muziko.png')">
<div id="headbackground">
<div id="headcontent">
<div id="language"> <a href="index.html"><img src="pictures/tr.png" width="40" height="24" alt="tr"></a>
<br><br>
<a href="de/"><img src="pictures/de.png" width="40" height="24" alt="de"></a>
<br><br>
<a href="en/"><img src="pictures/en.png" width="40" height="24" alt="en"></a>
</div>
</div>
<div id="buttons">
<div id="navimiddle"><a href="/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('home','','pictures/Layout/Button/homeo.png',1)"><img src="pictures/Layout/Button/homeo.png" alt="homebutton" width="190" height="50" id="home"></a><a href="tr/grafik/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('grafik','','pictures/Layout/Button/grafiko.png',1)"><img src="pictures/Layout/Button/grafik.png" alt="grafikbutton" width="141" height="50" id="grafik"></a><a href="tr/web/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('web','','pictures/Layout/Button/webo.png',1)"><img src="pictures/Layout/Button/web.png" alt="webbutton" width="101" height="50" id="web"></a><a href="tr/reklam/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('reklam','','pictures/Layout/Button/reklamo.png',1)"><img src="pictures/Layout/Button/reklam.png" alt="reklambutton" width="159" height="50" id="reklam"></a><a href="tr/foto/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('foto','','pictures/Layout/Button/fotoo.png',1)"><img src="pictures/Layout/Button/foto.png" alt="fotobutton" width="108" height="50" id="foto"></a><a href="tr/video/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('video','','pictures/Layout/Button/videoo.png',1)"><img src="pictures/Layout/Button/video.png" width="125" height="50" id="video" alt="videobutton"></a><a href="tr/muzik/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('muzik','','pictures/Layout/Button/muziko.png',1)"><img src="pictures/Layout/Button/muzik.png" alt="muzikbutton" width="200" height="50" id="muzik"></a>
</div>
</div>
</div>
<div id="contentbody">
<div id="contentup">
<div id="contentuplayout"><center>
<iframe width="950" height="370" src="http://www.youtube.com/embed/E-dw03-s1vA?rel=0" frameborder="0" allowfullscreen></iframe>
</center>
</div>
</div>
<div class="contentdevider"></div>
<div id="contentmain">
<div id="mainrow1">
<span class="linkstyle2">
<div class="smallarticel" >
<div class="smallarticelpic"><a href="tr/grafik/"><span class="rollover"><img src="pictures/Grafik-Site/kurumsal-kimlik.png" width="270" height="150" alt="ambalaj"> </span></a>
</div><hr>
<strong><a href="tr/grafik/">GRAFiK TASARIM</a></strong>
<hr>
<p>Profesyonel ve Modern Grafik Tasarım</p>
</div>
<div class="smallarticel2">
<div class="smallarticelpic"><a href="tr/web/"><img src="pictures/Grafik-Site/webdesign.jpg" width="270" height="150" alt="ambalaj"></a>
</div><hr>
<strong><a href="tr/web/">WEB TASARIM</a></strong>
<hr>
<p>Profesyonel ve Modern Webtasarım
</p>
</div>
<div class="smallarticel">
<div class="smallarticelpic"><a href="tr/foto/"><img src="pictures/fotograf-cekim.jpg" width="270" height="150" alt="ambalaj"></a>
</div>
<hr>
<strong><a href="tr/foto/">FOTOĞRAF ÇEKİMİ</a></strong>
<hr>
<p>Profesyonel Stüdyo ve Outdoor Çekimleri</p>
</div>
</span>
</div>
<div id="mainrow2">
<span class="linkstyle2">
<div class="smallarticel">
<div class="smallarticelpic"><a href="tr/reklam/"><img src="pictures/Reklam-Site/radio.jpg" width="270" height="150" alt="ambalaj"></a>
</div><hr>
<strong><a href="tr/reklam/">REKLAM AJANSI</a></strong>
<hr>
<p>Profesyonel Reklam Tasarim ve Jingle</p>
</div>
<div class="smallarticel2">
<div class="smallarticelpic"><a href="tr/video/"><img src="pictures/video-prodüskiyon.jpg" width="270" height="150" alt="ambalaj"></a>
</div><hr>
<strong><a href="tr/video/">Video Prodüksiyon</a></strong>
<hr>
<p>Profesyonel Video Prodüksiyon ve Animasyon</p>
</div>
<div class="smallarticel">
<div class="smallarticelpic"><a href="tr/muzik/"><img src="pictures/müzik-prodüksiyon.jpg" width="270" height="150" alt="ambalaj"></a>
</div><hr>
<strong><a href="tr/muzik/">Müzik Prodüksiyon</a></strong>
<hr>
<p> Profesyonel Müzik Prodüksiyon - Online Mastering ve Mixing -</p>
</div>
</span>
</div>
</div>
<div class="placeholder"></div>
</div>
<div id="footer">
<div id="footercontent">
<span class="linkstyle1">
<a href="tr/hakkimizda/">Hakkımızda</a> | <a href="tr/kariyer/">Kariyer</a> | <a href="tr/iletisim/">İletişim</a> | <a href="tr/gizlilik/">Gizlilik</a></span>
<div id="copyright">
Can-Kat © 2012
</div>
</div>
</div>
</body>
</html>
AND THE STYLE / CSS：問題は#contentbodyにあり、残りは問題なく中央に配置されています。
body {
background-color:#FFF;
margin-left:0px;
margin-top:0px;
margin-right:0px;
font-family:Verdana, Geneva, sans-serif;
}
#headbackground {
width:100%;
min-width:1024px;
height:300px;
position:relative;
float:left;
background-color:#2E2E2E;
}
#headcontent {
width:1000px;
height:180px;
position:relative;
margin-left:auto;
margin-right:auto;
margin-top:10px;
text-align:center;
background-image:url(../media/Can-Kat%20Productions%20Logo%20-%20wordpress.png);
background-repeat:no-repeat;
background-position:center;
}
#language {
width:40px;
position:relative;
float:left;
margin-left:920px;
margin-top:35px;
display:none;
}
#buttons {
width:1024px;
height:50px;
margin-left:auto;
margin-right:auto;
color:#FFF;
position:relative;
font-size:20px;
}
#navimiddle
{
width:1024px;
height:50px;
position:reltive;
margin-top:4px;
float:left;
background-image:url(../pictures/Layout/Button/leiste.png);
}
#contentbody {
width:1000px;
margin-top:-55px;
margin-left:50%;
left:-500px;
float:left;
position:relative;
display:block;
}
#contentup {
width:997px;
background-image:url(../media/body_top.png);
background-repeat:no-repeat;
position:relative;
}
#contentuplayout {
width:960px;
margin-left:auto;
margin-right:auto;
padding-top:18px;
position:relative;
}
#contentmain {
width:902px;
margin-left:auto;
margin-right:auto;
margin-top:-10px;
position:relative;
}
#mainrow1 {
width:902px;
height:305px;
position:relative;
}
#mainrow2 {
width:902px;
height:280px;
margin-top:5px;
position:relative;
}
#verticalrowleft {
width:600px;
height:auto;
color:#000;
position:relative;
float:left;
}
#verticalrowright {
width:295px;
height:auto;
position:relative;
float:right;
border-left:1px solid #000;
text-align:center;
}
#footer {
width:100%;
min-width:1024px;
height:100px;
position:relative;
background-color:#2E2E2E;
float:left;
}
#footercontent {
width:902px;
margin-left:auto;
margin-right:auto;
margin-top:10px;
position:relative;
color:#FFF;
}
#copyright {
width:150px;
float:right;
position:relative;
}
/* -------- Classes --------- */
.rollover {
width:270px;
background-image:url(../pictures/Layout/hover-zoom.png);
background-repeat:no-repeat;
background-color:transparent;
margin:auto;
}
.smallarticel {
width:280px;
height:296px;
background-color:#DDD;
border:thin #333;
text-align:center;
position:relative;
float:left;
border-radius:5px;
}
.smallarticel2 {
width:280px;
height:296px;
margin-left:26px;
margin-right:26px;
background-color:#DDD;
border:thin #333;
text-align:center;
float:left;
position:relative;
border-radius:5px;
}
.smallarticelpic {
width:270px;
margin-left:5px;
margin-top:5px;
position:relative;
background-color:#000;
background-image:url(../pictures/Layout/hover-zoom.png);
}
.contentdevider {
width:960px;
height:40px;
margin-left:auto;
margin-right:auto;
background-image:url(../pictures/contentdevider.png);
position:relative;
}
.placeholder { width:100%; height:30px; position:relative; float:left; }
.linkstyle1 A:link {color:#FFF; text-decoration:none;}
.linkstyle1 A:visited {color:#FFF; text-decoration:none;}
.linkstyle1 A:active {color:#FFF; text-decoration:none;}
.linkstyle1 A:hover {
color: #F0F0F0;
text-decoration: underline;
}
.linkstyle2 A:link {color:#000; text-decoration:none;}
.linkstyle2 A:visited {color:#000; text-decoration:none;}
.linkstyle2 A:active {color:#000; text-decoration:none;}
.linkstyle2 A:hover {color:#000; text-decoration:underline;}
img
{ border-style: none; }
#language img { border-radius:5px; }
.centertext { text-align:center; }
a.link{
background:transparent url(a-bg.png) no-repeat -81px bottom;
}