急にCSSが反映されなくなった
質問お願いします。自社サイトの更新を担当することになったのですが、数日前まできちんとサイト上でも
CSSが反映されていたのに、先日からいきなりCSSが反映されなくなり原因が分からず困っています。
当方、コードは読める位の超初心者レベルです。。
因みに、コードは下記のようになっています。(途中省略してあります)また、Dreamweaver8を使用しています。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta name="copyright" content="Nikukyu-Punch" />
<title>自社サイト</title>
<meta name="description" content="○○" />
<meta name="keywords" content="○○" />
<link href="style.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
.style2 {font-size: 16px}
.style8 {color: #3366FF}
.style11 {color: #b65313; font-size: 14px; }
.style12 {color: #b65313}
-->
</style>
</head>
<body>
<div id="container">
<div id="header">
<h1>○○</h1>
<a href="index.html"><img src="images/logo1.gif" alt="○○" name="logo" width="653" height="114" id="logo" /></a></div>
<!--/header-->
<div id="contents">
<div id="wrap">
<div id="main">
<h2>○○</h2>
<br />
<p >○○</p>
<div class="item-box"><img src="images/item/3401.jpg" alt="○" width="164" height="164" /><div class="box-btn3"><a href="○"><img src="images/new1.gif" alt="new" />○○<br />
</a></div>
</div>
<div class="item-box"><img src="images/item/3403.jpg" alt="○○)" width="164" height="164" />
<div class="box-btn3"><a href="○○">○○</a></div>
</div>
</div>
<!--/main-->
<div id="sub">
</div>
<!--/wrap-->
<div id="side">
<!--/side-->
<div id="footer">
Copyright(C)○○ All Rights Reserved.<br />
</div>
<!--/footer-->
</div>
<!--/contents-->
</div>
<!--/container-->
</body>
</html>
---------------------CSS-----------------------------------
@charset "shift_jis";
body {
font-family: "メイリオ", Meiryo,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "MS Pゴシック", "MS PGothic", sans-serif;
font-size: 90%;
line-height: 2;
color: #333333;
margin: 0px;
padding: 0px;
text-align: center;
}
/*コンテナー
---------------------------------------------------------------------------*/
#container {
text-align: left;
width: 1091px;
margin-right: auto;
margin-left: auto;
border-top: 5px solid #ff476d;
background-color: #FFFFFF;
}
/*3カラムを囲むボックス
---------------------------------------------------------------------------*/
#contents {
clear: left;
width: 100%;
}
/*左・中央を囲むボックス
---------------------------------------------------------------------------*/
#wrap {
width: 897px;
float: left;
padding-bottom: 50px;
margin-top: 20px;
}
/*中央ブロック
---------------------------------------------------------------------------*/
#main {
float: right;
width: 703px;
}
#main .item-box{
foat:left;
width:200px;
height:300px;
border:1px #CCCCCC solid;
padding:5px 5px 0px 5px;
float: left;
margin-top: 0px;
margin-right: 6px;
margin-bottom: 15px;
margin-left: 15px;
}
#main .item-box img{
/*margin: 5px 0px 5px 5px;*/
margin-left:15px;
border:solid #cccccc 1px;
}
#main .box-btn3 {
font-size:10px;
color: #333333;
width:164px;
text-align:center;
padding: 0px 0px 0px 0px;
margin-left:15px;
border:1px #CCCCCC solid;
}
/*フッター
---------------------------------------------------------------------------*/
#footer {
clear: both;
width: 100%;
text-align: center;
border-top: 1px solid #bfbfbf;
padding-top: 1em;
padding-bottom: 1em;
}
どなたかご教授頂けたら助かります
お礼
ありがとうございます。 paddingのかわりに margin-right: 20px; margin-left: 20px; にしてみましたがだめでした。 margin-right: auto; margin-left: auto; もだめでした。 Dreamweaverで作成しているのですがDreamweaver上では paddingでもmarginちゃんと表示されるのですがプレビューするとだめなんです…