アプリ版:「スタンプのみでお礼する」機能のリリースについて

サイトのトップページに、javascriptのスライドショーを配置したいと思っています。
(イメージはこんなスライドです)
http://sandbox.scriptiny.com/tinyslider2/

WEBデザインもまだ勉強中でプログラム領域の知識は全くないため、
サンプルコードを公開しているサイトさんでお借りしようと思っています。
例の通りにcssやjsをリンクさせ、スライド自体は上手く行っているのですがレイアウトがうまくいきません。
(中途半端にスライドしたり、画像送りのボタンが表示されなかったり)

問題点として、サンプルのcssの記述と、もともとのサイトのcssがぶつかってしまう(?)ことがあります。
どのサンプルもcssで
margin:0;padding:0;
がbodyもしくはアスタリスク(*)で全要素に指定されており、
これが元のトップページのcssレイアウトに影響してしまいます。

こういう場合、cssの処理はどうするのが適正でしょうか。
素人のため分かりにくい文章になってしまっておりますが、その際はご指摘いただけましたら幸いです。
宜しくお願いいたします。

A 回答 (1件)

例のサイトは、


<div id="container">
内にスライドショーが配置されているので、

*{margin:0;padding:0;}

div#container *{margin:0;padding:0;}
とすれば良いでしょう。
(本来は、アスタリスクの全称指定でリセットせずに個別指定した方が良い)

そうすれば、元のデザインには影響する事がなく、
スライドショーだけに適応されます。
但し、質問者さんの構造が
スライドショーの外枠が<div id="container">だとは限らないし
別のセレクタが関係している場合や優先度の問題もありますので・・・
    • good
    • 0
この回答へのお礼

早速の回答ありがとうございました。

ご指導いただいた内容で一度やってみます。
positionの指定や優先度など、知識がたくさん必要ですね・・・。

また結果もご報告できればと思います。
ありがとうございました。

お礼日時:2011/11/09 01:14

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!