質問 > 管理機能 > レイアウトが崩れる |
管理機能
スレッド表示 | 古いものから | 前のトピック | 次のトピック | 下へ |
投稿者 | スレッド |
---|---|
ken-o |
投稿日時: 2012/3/27 9:30
対応状況: −−−
|
長老 登録日: 2011/9/22 居住地: 投稿: 222 |
Re: レイアウトが崩れる 2.11.2のデフォルトのdetail.tplですが、
<!--★お気に入り登録★--> がある、257行目からの一例です。 これで、一応商品画像が入っていない時に出る「画像はありません」のすぐ下辺りに来るかと思います。 引用:
|
greanpice |
投稿日時: 2012/3/26 20:29
対応状況: −−−
|
長老 登録日: 2011/7/12 居住地: 投稿: 180 |
Re: レイアウトが崩れる javascriptでやってみましたが、崩れてしまいます。
やはりform自体が隣接すると隣の画像の高さに直結してしまうようです。 padding:-数値; 指定でやってみましたが、やはり各ブラウザで高さが崩れてしまいます。 |
ken-o |
投稿日時: 2012/3/26 19:01
対応状況: −−−
|
長老 登録日: 2011/9/22 居住地: 投稿: 222 |
Re: レイアウトが崩れる 先ほどの技でも、基本どのブラウザでもそれほど大きく違って見えることはないかと思います。
(僕の環境、ie9とopera、fxでは大体同じところです。) ただし、tanaka 様が仰っている方法が一番ベストなような気がします。 僕なら、javascriptを使用して分岐させます。 http://okwave.jp/qa/q545699.html
|
greanpice |
投稿日時: 2012/3/26 18:25
対応状況: −−−
|
長老 登録日: 2011/7/12 居住地: 投稿: 180 |
Re: レイアウトが崩れる そういった場合ですが、スタイルシートで
ie9以上の調整をpaddingやmarginなどで行った場合 今度は別のブラウザで高さがあわなくなる恐れがあるのですが、 何かいい方法があれば幸いですが。 |
tanaca |
投稿日時: 2012/3/26 18:13
対応状況: −−−
|
仙人 登録日: 2010/11/28 居住地: 福岡県 投稿: 332 |
Re: レイアウトが崩れる 憶測で書いているので大きく外していたらすみません。
例えば、商品メイン画像を凄く縦に長い画像を表示させていたり、サブ画像をメイン画像の下に縦に並ぶように表示させていたたりすると、その画像が終わった場所から問い合わせボタンが表示されるかと思います。 逆に画像の領域の高さが小さくて、カートボタン側の領域の高さが大きい場合はそのすぐ下に来ると思います。 なので、そのあたりはスタイルシートで調整する必要があるように思います。
|
ken-o |
投稿日時: 2012/3/26 18:01
対応状況: −−−
|
長老 登録日: 2011/9/22 居住地: 投稿: 222 |
Re: レイアウトが崩れる greanpice 様
確認したいのですが、本案件は、画像のすぐ下に来るようにしたいのですか? それとも、「カゴに入れる」ボタンがある青い枠のすぐ下に来るのは理想なのですか? 前者は、先ほど頂いた記述ですと余白ができます。というか余白ではなく、もともとあるformの構成が右に画像、左に商品情報/カゴへボタン ですから、その構成のすぐ下にできるのは仕方ありません。 なので、画像のすぐ下にボタンを設けるのであれば、 position:absolute; を使って、自由に移動できるようにして、margin-top;やmargin-leftを駆使して移動します。 後者であれば、margin-leftで移動させてあげればいいと思います。 とりあえず、どうしたいかを教えて下さい。 tanaca 様 いつも、お世話になっております。 はじめは僕もそう思いましたが、なんかもっと単純なことな気がしてきました。
|
greanpice |
投稿日時: 2012/3/26 17:39
対応状況: −−−
|
長老 登録日: 2011/7/12 居住地: 投稿: 180 |
Re: レイアウトが崩れる 先ほどの記述で外にformを記述していますが、
問題ありますか?? FORM自体に改行の要素がありますが 以下の記述で <form> </form> 極端なスペース <form> </form> です。 |
tanaca |
投稿日時: 2012/3/26 16:58
対応状況: −−−
|
仙人 登録日: 2010/11/28 居住地: 福岡県 投稿: 332 |
Re: レイアウトが崩れる 横から失礼します。
フォームが動作する・しないは別として・・ 原因はやはりken-o様がおっしゃってありますように、 </form> <!--▲買い物かご--> の外(下)に配置されている事が原因ではないでしょうか。 たぶん、IE9では下記のようになっているような気がします。 <form name="form1" id="form1" method="post" action="?"> <div id="detailarea" class="clearfix"> <div id="detailphotobloc">画像情報</div> <div id="detailrightbloc">カート情報</div> </div> </form> <!--▲買い物かご--> お問い合わせボタンの記述
|
greanpice |
投稿日時: 2012/3/26 15:12
対応状況: −−−
|
長老 登録日: 2011/7/12 居住地: 投稿: 180 |
Re: レイアウトが崩れる </form>
<!--▲買い物かご--> <!--▼商品問い合わせ--> <form method="post" action=""> <input type="hidden" name="transactionid" value="c79928e5dabd4630a698dbf804adebec3a281f62" /> <input type="hidden" name="name" value="" /> <input type="hidden" name="product_code" value="410391" /> <!--<input type="submit" value="この商品について問い合わせをする">--> <button type="submit">この商品について問い合わせをする</button> </form> </div> こんな感じですが、わかりますでしょうか?? また既存のFORMか新しく追加したFORMをとると 上につめられて直ります。 CSSでformの設定はpadding:0px; 一括してしてあります。 |
ken-o |
投稿日時: 2012/3/26 14:49
対応状況: −−−
|
長老 登録日: 2011/9/22 居住地: 投稿: 222 |
Re: レイアウトが崩れる 現物を見ていないので、なんとも言えないのですが、もしかしたらその新しいformに問題があるかもしれません。
その作られたformのソースは公開できませんか? または、どこかのサイトでフリーで公開されていたのであれば、urlを教えてください。
|
(1) 2 » |
スレッド表示 | 古いものから | 前のトピック | 次のトピック | トップ |