Changeset 18623 for branches/comu-ver2/html/user_data

Timestamp:

2010/04/24 14:03:55 (16 years ago)

Author:

Seasoft

Message:

#612(画面幅の調整を容易にする) 現状を一旦コミット。

• クラス「frame_outer」のCSS定義を変更でサイト全体の画面幅を調整できるようにする試み。

Location:

branches/comu-ver2/html/user_data/packages/default

Files:

• css/index.css (modified) (5 diffs)
• css/main.css (modified) (14 diffs)
• css/under.css (modified) (2 diffs)
• img/bloc/best5 (added)
• img/bloc/best5/title_icon.gif (added)
• img/bloc/cart (added)
• img/bloc/cart/title_icon.gif (added)
• img/bloc/category (added)
• img/bloc/category/title_icon.gif (added)
• img/bloc/login (added)
• img/bloc/login/title_icon.gif (added)
• img/bloc/news (added)
• img/bloc/news/title_icon.gif (added)
• img/bloc/search_products (added)
• img/bloc/search_products/title_icon.gif (added)
• img/common/gradation_v50.gif (added)
• img/side/title_cartin.jpg (deleted)
• img/side/title_cat.jpg (deleted)
• img/side/title_login.jpg (deleted)
• img/side/title_search.jpg (deleted)
• img/top/news.jpg (deleted)
• img/top/osusume.jpg (deleted)

branches/comu-ver2/html/user_data/packages/default/css/index.css

@@ -4 +4 @@
 /* FLASH
 ----------------------------------------------- */
-div#flasharea {
-    width: 400px;
-    margin: 0 auto;
+#flasharea {
+    text-align: center;
 }
 
@@ -12 +11 @@
 /* 新着情報
 ----------------------------------------------- */
-div#newsarea {
-    width: 400px;
-    margin: 0 auto;
-    font-size: 90%;
+#newsarea {
 }
 
-div#newsarea dl {
+#newsarea dl {
     padding: 10px 0;
     background: url("../img/common/line_400.gif") no-repeat bottom;
 }
 
-div#newsarea dl.end {
+#newsarea dl.end {
     padding: 10px 0;
     background: url("") no-repeat bottom;
 }
 
-div#newsarea dl dt {
+#newsarea dl dt {
     padding: 0 0 0 20px;
     background: url("../img/top/news_icon.gif") no-repeat;
@@ -36 +32 @@
 /* おすすめ商品
 ----------------------------------------------- */
-div#recomendarea {
-    margin: 0 10px;
+#recomendarea {
 }
 
-div.recomendblock {
+.recomendblock {
     clear: both;
     width: 100%;
@@ -48 +43 @@
 }
 
-div.recomendleft,
-div.recomendright {
+.recomendleft,
+.recomendright {
     width: 47.5%;
 }
 
-div.recomendleft {
+.recomendleft {
     float: left;
 }
 
-div.recomendright {
+.recomendright {
     float: right;
     position: relative;
 }
 
-div.recomendleft p,
-div.recomendright p {
+.recomendleft p,
+.recomendright p {
     margin: 0 0 5px 0;
 }
 
-div.recomendleft img,
-div.recomendright img {
+.recomendleft img,
+.recomendright img {
     display: block;
     float: left;
@@ -74 +69 @@
 }
 
-div.recomendleft h3,
-div.recomendright h3 {
+.recomendleft h3,
+.recomendright h3 {
     font-size: 100%;
 }

branches/comu-ver2/html/user_data/packages/default/css/main.css

@@ -81 +81 @@
 ----------------------------------------------- */
 h2 {
-    padding: 15px 0 0 0;
 }
 h2.title {
@@ -96 +95 @@
 /* テーブル共通指定
 ----------------------------------------------- */
-table  {
+table {
     margin: 15px auto 0 auto;
     border-top: 1px solid #ccc;
@@ -150 +149 @@
 /* ヘッダーロゴ
 ------------------------------------------------ */
-div#header {
+#header {
     background: url("../img/header/bg.gif");
-    width: 780px;
     height: 95px;
     margin: 0 auto;
 }
-div#header h1 a {
+#header h1 a {
     float: left;
     display: block;
@@ -164 +162 @@
     background: url("../img/header/logo.gif") no-repeat;
 }
-div#header em {
+#header em {
     display: none;
 }
@@ -183 +181 @@
 /* フレーム
 ----------------------------------------------- */
-div#container {
-    width: 764px;
+.frame_outer {
+    width: 950px;
     margin: 0 auto;
-    padding: 0 8px;
     background-color: #fff;
+}
+#container {
     text-align: left;
-}
-#container:after {/* firefox背景色表示用 */
-    content: "";
-    display: block;
     clear: both;
-    height: 1px;
-    overflow: hidden;
-}
-
-div#leftcolumn {
+}
+
+#leftcolumn {
     float: left;
-    width: 166px;
-}
-
-div#rightcolumn {
+    width: 20%;
+}
+
+#rightcolumn {
+    float: right;
+    width: 20%;
+}
+
+/* メインコンテンツ
+----------------------------------------------- */
+.main_column {
+    padding: 10px 0 20px;
+}
+
+/* 3カラム設定 */
+#three_maincolumn {
+    width: 58%;
+    margin-left: 1%; /* 右側を同等幅の未定義空間として、段落崩れを防ぐ */
     float: left;
-    width: 166px;
-}
-
-/* メインコンテンツ
------------------------------------------------ */
-/* 3カラム設定 */
-div#three_maincolumn {
+}
+
+/* 2カラム設定 (メイン部が左) */
+#two_maincolumn_left {
+    width: 79%;
     float: left;
-    width: 432px;
-    padding: 15px 0 0 0;
-}
-
-/* 2カラム設定 */
-div#two_maincolumn {
-    float: left;
-    width: 598px;
-    padding: 15px 0 0 0;
+}
+
+/* 2カラム設定 (メイン部が右) */
+#two_maincolumn_right {
+    width: 79%;
+    float: right;
 }
 
 /* 1カラム設定 */
-div#one_maincolumn {
-    padding: 10px 0 0 0;
+#one_maincolumn {
 }
 
@@ -232 +233 @@
 ----------------------------------------------- */
 div#topcolumn{
-    clear:both;
-    margin:0px; 
+    clear:both;
+    margin:0px; 
 }
 div#bottomcolumn{
-    clear: both;
-    margin:0px;
+    clear: both;
+    margin:0px;
 }
 
@@ -245 +246 @@
     margin: 0;
     padding: 0;
+    background: url(../img/common/gradation_v50.gif) top repeat-x;
 }
 ul.button_like li a {
@@ -269 +271 @@
 }
 
+/* ブロック共通
+----------------------------------------------- */
+.bloc_body {
+    background-color: #FFF;
+}
+.side_column {
+    overflow-x: hidden; /* IE6 表示乱れ防止 */
+}
+.side_column .bloc_outer {
+    margin: 10px 5%;
+}
+.side_column .bloc_body {
+    border: solid 1px #ccc;
+}
+.side_column h2 {
+    border-style: solid;
+    border-color: #F60 #ccc #999 #ccc;
+    border-width: 3px 1px 2px;
+    background: url(../img/common/gradation_v50.gif);
+    padding: 5px 0 4px 8px;
+    font-size: 14px;
+}
+.side_column h2 img.title_icon {
+    vertical-align: -2px;
+}
+.main_column .bloc_outer {
+    margin: 10px 0;
+}
+.main_column .bloc_outer h2 {
+    border-style: solid;
+    border-color: #ccc #ccc #999;
+    border-width: 1px 1px 2px;
+    background: #f4f4d8;
+    padding: 5px 0 4px 8px;
+    font-size: 14px;
+}
+.main_column .bloc_outer h2 img.title_icon {
+    vertical-align: -2px;
+}
+
 /* カゴの中
 ----------------------------------------------- */
-div#cartarea {
-    width: 144px;
+#cartarea {
     padding: 10px;
-    border: solid 1px #ccc;
-}
-
-div#cartarea p {
+}
+
+#cartarea p {
     padding: 5px 0 10px 0;
 }
 
-div#cartarea p.item {
+#cartarea p.item {
     padding: 0 0 10px 0;
     background: url("../img/side/line_146.gif") no-repeat bottom;
 }
 
-div#cartarea .btn {
+#cartarea .btn {
     padding: 0;
     text-align: center;
 }
 
-div#cartarea .price {
+#cartarea .price {
     color: #FF0000;
     font-weight: bold;
 }
 
-
 /* カテゴリー
 ----------------------------------------------- */
-div#categoryarea {
-    width: 144px;
+#categoryarea {
     padding: 10px;
-    border: solid 1px #ccc;
     background-color: #fff1e3;
 }
 
-div#categoryarea li {
+#categoryarea li {
     padding: 0 0 0 20px;
     background: url("../img/common/arrow_blue.gif") 0 3px no-repeat;
 }
-div#categoryarea li.onmark {
+#categoryarea li.onmark {
     background: url("../img/common/arrow_red.gif") 0 3px no-repeat;
 }
-div#categoryarea li.level1 {
+#categoryarea li.level1 {
     font-weight: bold;
 }
-div#categoryarea li.level1 li {
+#categoryarea li.level1 li {
     font-weight: normal;
 }
-div#categoryarea li a {
+#categoryarea li a {
     display: block;
     padding: 3px 0;
@@ -335 +372 @@
 }
 
-
 /* ガイドリンク
 ----------------------------------------------- */
+#guidearea {
+    margin-top: 1em;
+    border: none;
+}
 #guidearea ul.button_like {
-    margin-top: 1em;
     font-size: 11px;
 }
@@ -346 +385 @@
 ----------------------------------------------- */
 div#loginarea {
-    width: 144px;
     padding: 0 10px 10px 10px;
-    border: solid 1px #ccc;
 }
 
@@ -373 +410 @@
 ----------------------------------------------- */
 div#searcharea {
-    width: 144px;
     padding: 0 10px 10px 10px;
-    border: solid 1px #ccc;
 }
 
@@ -394 +429 @@
 ----------------------------------------------- */
 #block-calendar {
+    background-color: transparent;
+    border: none;
 }
 
 #block-calendar table {
+    background: #FFF;
     border-collapse: collapse;
     margin: 0 auto 10px;
@@ -477 +515 @@
 ----------------------------------------------- */
 #pagetop {
-    width: 764px;
     margin: 0 auto;
-    padding: 30px 8px 15px 8px;
-    background-color: #fff;
+    padding: 15px 8px;
     text-align: right;
+    clear: both;
 }
 
 #fotter {
-    width: 764px;
     margin: 0 auto;
     padding: 15px 8px;
@@ -492 +528 @@
     font-size: 90%;
     color: #fff;
-    text-align: left;
-}
+    text-align: center;
+    clear: both;
+}

branches/comu-ver2/html/user_data/packages/default/css/under.css

@@ -5 +5 @@
 ----------------------------------------------- */
 div#undercolumn {
-    width: 580px;
-    margin: 15px auto 0 auto;
+    margin: 15px 15px 0 0;
 }
 
 div#undercolumn table {
-    width: 570px;
+    width: 98.2%;
 }
 
@@ -83 +82 @@
 
 div#undercolumn_entry .area470 {
-    width: 570px;
     height: 520px;
     margin: 5px 0 0 0;