こんばんは。
いつもお世話になります。

今回、商品一覧ページの商品ごとに
枠を付けようかと思っています。

ただ、どうも上手くいかないため
お力添えをと思い投稿しました。


イメージ的には全体的にマスの中に入れるのではなく
（こちらはできたのですが・・・）

商品の写真を個々に囲むイメージです。


★一覧ページ★
　□□□□□
　□□□□□
　□□□□□
　　　・
　　　・

上記のイメージで、枠同士は間隔を開けて
□の枠の中には写真、ブランド名、、品番、価格を
入れていきたいと思っています。



contents.css
/* ==============================================
▼商品一覧
=============================================== */

・
・
・

/* レイアウト
----------------------------------------------- */
div.list_area {
padding: 1px 2px 55px 2px;
width: 19%;
overflow: hidden;
　　position: relative;
float: left;
height:335px;

border: 1px solid #C0C0C0;
padding: 1px 1px 1px 1px;
background: #ffffff;

}

div.listphoto {
padding: 10px 10px 5px 15px;
text-align: left;

}

/* メインカラム用 1カラム時*/
#one_maincolumn div.listrightbloc {
float: right;
width: 100%;
}

/* メインカラム用 2カラム時*/
#two_maincolumn_right div.listrightbloc ,
#two_maincolumn_left div.listrightbloc {
float: left;#script tag escaped#;
padding: 0px 10px 5px 20px;
width: 100%;
}

/* メインカラム用 3カラム時*/
#three_maincolumn div.listrightbloc {
float: right;
width: 90%;
}



どうか、宜しくお願い致します。



-----------------------------------
[EC-CUBE]2.11.4
[OS]Windows 7
[PHP] 5.3.6
[データベース] MySQL 5.0.67-log
[WEBサーバ] Apache
-----------------------------------

商品の写真を個々に囲む枠を表示したいのであれば、

div.listphoto {
padding: 10px 10px 5px 15px;
text-align: left;

}

に、

border: 1px solid silver;
margin: 10px;　

を追記するだけ表示されると思いますが、、
勘違いしていたら、すみません。

----------------
他社システムからEC-CUBEへの移行などお気軽にご相談ください。
福岡のホームページ制作会社 ECカンパニー
担当：田中利宏

tanaca様

お返事ありがとうございます。
折角のご助力に申し訳ないのですが
イメージと違いまして

下記のようなイラストのイメージなんです。

http://www.laid-back.jp/img/image_0609.jpg


写真のまわりの枠ではなく
内容も含めて枠で囲いたい、しかもすべて繋がっている
テーブルのセルのようにはしたくはないのですが


宜しくお願い致します。

1商品の内容全てを囲みたいのでしたら、

div.list_area {
padding: 5px;
width: ○○%;
height: ○○px;
overflow: hidden;
float: left;
border: 3px solid silver;
margin: 5px;
}

と、div.list_areaにborderを追記するとよさそうです。
各サイズは必要に応じて調整ください。

----------------
他社システムからEC-CUBEへの移行などお気軽にご相談ください。
福岡のホームページ制作会社 ECカンパニー
担当：田中利宏