site_study_com の回答履歴

下記の１ページだけ、右背景が途中で切れてしまう不具合が出てしまいました。 このような感じです。 http://marimekko2525.web.fc2.com/ 設定方法は下記のサイトを参考にして作りました。 http://www.webopixel.net/javascript/517.html スライドショーが入っている”<div id="cont">”部分に原因があると思うのですが、 改善策が分かりません。。。 どなたか分かる方いらっしゃいましたらアドバイスをお願いします。 cssソース /*====↓reset.css↓====*/ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,legend,input,p,blockquote,th,td { margin:0;padding:0; } img{ border: 0; } /*====↓base.css↓====*/ #cont { width: 610px; height: 100%; position: relative; margin: 50px auto; z-index: 70; overflow: hidden; } #works_deta{ clear:both; margin-top:100px; margin-bottom:10px; padding:20px; background-color:#333535; } #works_deta h4, #works_deta_right h5{ margin-bottom:10px; } #works_deta_left{ float:left; } #works_deta_right{ float:right; width:390px; } #works_deta_right p{ color:#ffffff; font-size: 85%; line-height:1.8em; } hr#works_deta_right{ clear:both; } p.works_deta{ color:#ffffff; font-size: 85%; line-height:1.8em; text-align:right; clear:both; } #works_deta_right img.back_to_list{ float: right; } /*====↓iview.css↓====*/ /* The slider */ .iviewSlider { overflow: hidden; } /* The timer in the Slider */ #iview-timer { position: absolute; z-index: 100; border-radius: 5px; cursor: pointer; } #iview-timer div { border-radius: 3px; } /* The Preloader in the Slider */ #iview-preloader { position: absolute; z-index: 1000; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border: #000 1px solid; padding: 1px; width: 100px; height: 3px; } #iview-preloader div { float: left; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; height: 3px; background: #000; width: 0px; } /* The strips and boxes in the Slider */ .iview-strip { display:block; position:absolute; z-index:5; } .iview-block { display:block; position:absolute; z-index:5; } /* Direction nav styles (e.g. Next & Prev) */ .iview-directionNav a { position:absolute; top:45%; z-index:9; cursor:pointer; } .iview-prevNav { left:0px; } .iview-nextNav { right:0px; } /* Control nav styles (e.g. 1,2,3...) */ .iview-controlNav { position:absolute; z-index:9; } .iview-controlNav a { z-index:9; cursor:pointer; } .iview-controlNav a.active { font-weight:bold; } .iview-controlNav .iview-items ul { list-style: none; } .iview-controlNav .iview-items ul li { display: inline; position: relative; } .iview-controlNav .iview-tooltip { position: absolute; } /* The captions in the Slider */ .iview-caption { position:absolute; z-index:4; overflow: hidden; cursor: default; } /*====↓style.css↓====*/ .container { display: block; width: 600px; margin: 0px auto; } #iview { display: block; width: 600px; background: #000; background: rgba(0, 0, 0, 0.7); padding: 5px; border-radius: 5px; position: relative; margin: 10px auto; } #iview .iviewSlider{ display: block; width: 600px; height: 360px; overflow: hidden; border-radius: 4px 4px 0px 0px; } .iview-controlNav { position: static; height: 45px; text-align: center; border-radius: 0px 0px 4px 4px; } .iview-controlNav .iview-items { display: block; padding: 0px 20px; } .iview-controlNav a img { height: 60px; border: #000 1px solid; margin: 20px 10px 20px 0px; border-radius: 2px; } .iview-controlNav a.active img { border-color: #999; } #iview-preloader { border: #666 1px solid; width: 150px } #iview-preloader div { background: #666; }

下記の１ページだけ、右背景が途中で切れてしまう不具合が出てしまいました。 このような感じです。 http://marimekko2525.web.fc2.com/ 設定方法は下記のサイトを参考にして作りました。 http://www.webopixel.net/javascript/517.html スライドショーが入っている”<div id="cont">”部分に原因があると思うのですが、 改善策が分かりません。。。 どなたか分かる方いらっしゃいましたらアドバイスをお願いします。 cssソース /*====↓reset.css↓====*/ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,legend,input,p,blockquote,th,td { margin:0;padding:0; } img{ border: 0; } /*====↓base.css↓====*/ #cont { width: 610px; height: 100%; position: relative; margin: 50px auto; z-index: 70; overflow: hidden; } #works_deta{ clear:both; margin-top:100px; margin-bottom:10px; padding:20px; background-color:#333535; } #works_deta h4, #works_deta_right h5{ margin-bottom:10px; } #works_deta_left{ float:left; } #works_deta_right{ float:right; width:390px; } #works_deta_right p{ color:#ffffff; font-size: 85%; line-height:1.8em; } hr#works_deta_right{ clear:both; } p.works_deta{ color:#ffffff; font-size: 85%; line-height:1.8em; text-align:right; clear:both; } #works_deta_right img.back_to_list{ float: right; } /*====↓iview.css↓====*/ /* The slider */ .iviewSlider { overflow: hidden; } /* The timer in the Slider */ #iview-timer { position: absolute; z-index: 100; border-radius: 5px; cursor: pointer; } #iview-timer div { border-radius: 3px; } /* The Preloader in the Slider */ #iview-preloader { position: absolute; z-index: 1000; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border: #000 1px solid; padding: 1px; width: 100px; height: 3px; } #iview-preloader div { float: left; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; height: 3px; background: #000; width: 0px; } /* The strips and boxes in the Slider */ .iview-strip { display:block; position:absolute; z-index:5; } .iview-block { display:block; position:absolute; z-index:5; } /* Direction nav styles (e.g. Next & Prev) */ .iview-directionNav a { position:absolute; top:45%; z-index:9; cursor:pointer; } .iview-prevNav { left:0px; } .iview-nextNav { right:0px; } /* Control nav styles (e.g. 1,2,3...) */ .iview-controlNav { position:absolute; z-index:9; } .iview-controlNav a { z-index:9; cursor:pointer; } .iview-controlNav a.active { font-weight:bold; } .iview-controlNav .iview-items ul { list-style: none; } .iview-controlNav .iview-items ul li { display: inline; position: relative; } .iview-controlNav .iview-tooltip { position: absolute; } /* The captions in the Slider */ .iview-caption { position:absolute; z-index:4; overflow: hidden; cursor: default; } /*====↓style.css↓====*/ .container { display: block; width: 600px; margin: 0px auto; } #iview { display: block; width: 600px; background: #000; background: rgba(0, 0, 0, 0.7); padding: 5px; border-radius: 5px; position: relative; margin: 10px auto; } #iview .iviewSlider{ display: block; width: 600px; height: 360px; overflow: hidden; border-radius: 4px 4px 0px 0px; } .iview-controlNav { position: static; height: 45px; text-align: center; border-radius: 0px 0px 4px 4px; } .iview-controlNav .iview-items { display: block; padding: 0px 20px; } .iview-controlNav a img { height: 60px; border: #000 1px solid; margin: 20px 10px 20px 0px; border-radius: 2px; } .iview-controlNav a.active img { border-color: #999; } #iview-preloader { border: #666 1px solid; width: 150px } #iview-preloader div { background: #666; }

下記の１ページだけ、右背景が途中で切れてしまう不具合が出てしまいました。 このような感じです。 http://marimekko2525.web.fc2.com/ 設定方法は下記のサイトを参考にして作りました。 http://www.webopixel.net/javascript/517.html スライドショーが入っている”<div id="cont">”部分に原因があると思うのですが、 改善策が分かりません。。。 どなたか分かる方いらっしゃいましたらアドバイスをお願いします。 cssソース /*====↓reset.css↓====*/ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,legend,input,p,blockquote,th,td { margin:0;padding:0; } img{ border: 0; } /*====↓base.css↓====*/ #cont { width: 610px; height: 100%; position: relative; margin: 50px auto; z-index: 70; overflow: hidden; } #works_deta{ clear:both; margin-top:100px; margin-bottom:10px; padding:20px; background-color:#333535; } #works_deta h4, #works_deta_right h5{ margin-bottom:10px; } #works_deta_left{ float:left; } #works_deta_right{ float:right; width:390px; } #works_deta_right p{ color:#ffffff; font-size: 85%; line-height:1.8em; } hr#works_deta_right{ clear:both; } p.works_deta{ color:#ffffff; font-size: 85%; line-height:1.8em; text-align:right; clear:both; } #works_deta_right img.back_to_list{ float: right; } /*====↓iview.css↓====*/ /* The slider */ .iviewSlider { overflow: hidden; } /* The timer in the Slider */ #iview-timer { position: absolute; z-index: 100; border-radius: 5px; cursor: pointer; } #iview-timer div { border-radius: 3px; } /* The Preloader in the Slider */ #iview-preloader { position: absolute; z-index: 1000; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border: #000 1px solid; padding: 1px; width: 100px; height: 3px; } #iview-preloader div { float: left; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; height: 3px; background: #000; width: 0px; } /* The strips and boxes in the Slider */ .iview-strip { display:block; position:absolute; z-index:5; } .iview-block { display:block; position:absolute; z-index:5; } /* Direction nav styles (e.g. Next & Prev) */ .iview-directionNav a { position:absolute; top:45%; z-index:9; cursor:pointer; } .iview-prevNav { left:0px; } .iview-nextNav { right:0px; } /* Control nav styles (e.g. 1,2,3...) */ .iview-controlNav { position:absolute; z-index:9; } .iview-controlNav a { z-index:9; cursor:pointer; } .iview-controlNav a.active { font-weight:bold; } .iview-controlNav .iview-items ul { list-style: none; } .iview-controlNav .iview-items ul li { display: inline; position: relative; } .iview-controlNav .iview-tooltip { position: absolute; } /* The captions in the Slider */ .iview-caption { position:absolute; z-index:4; overflow: hidden; cursor: default; } /*====↓style.css↓====*/ .container { display: block; width: 600px; margin: 0px auto; } #iview { display: block; width: 600px; background: #000; background: rgba(0, 0, 0, 0.7); padding: 5px; border-radius: 5px; position: relative; margin: 10px auto; } #iview .iviewSlider{ display: block; width: 600px; height: 360px; overflow: hidden; border-radius: 4px 4px 0px 0px; } .iview-controlNav { position: static; height: 45px; text-align: center; border-radius: 0px 0px 4px 4px; } .iview-controlNav .iview-items { display: block; padding: 0px 20px; } .iview-controlNav a img { height: 60px; border: #000 1px solid; margin: 20px 10px 20px 0px; border-radius: 2px; } .iview-controlNav a.active img { border-color: #999; } #iview-preloader { border: #666 1px solid; width: 150px } #iview-preloader div { background: #666; }

CSSの勉強をしつつ、HPビルダー17を使ってHPの制作しているですが、 前のulタグで使った背景画像がずっと継承されて困っております。 当方の内容です↓ 【CSS記述】 ----------------------- #manu-nanyo{ display: block; position: absolute; background-image: url(fu/area_nanyo.png); background-repeat: no-repeat; background-position: center top; color: black; width: 200px; height: 40px; } .job-menu ul{ display: block; list-style-type: none; margin-top: 0px; margin-right: auto; margin-bottom: 0px; margin-left: auto; padding-top: 10px; padding-bottom: 10px; border-right-width: 1px; border-right-style: solid; border-right-color: silver; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: silver; text-decoration: none; } .job-menu li{ margin: 0; padding: 0; background: url(img/migi_aka.png) left no-repeat; } .job-menu a{ display: block; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 14px; color: black; font-size: 15px; text-decoration: none; } .job-menu a:hover{ background-color: rgb(204, 204, 204); color: red; } #newshop_bunner{ frot: left; width: 200px; padding-top: 10px; text-align: left; background-position: top left; } .newshop-banner ul{ margin-top: 20px; margin-left: 0; padding-left: 0; } .newshop-banner li{ text-decoration : none; text-align : right; font-size: 12px; } .newshop-banner a{ margin-top: 0px; padding-top: 5px; padding-right: 0px; padding-bottom: 5px; padding-left: 0px; color: blue; font-size: 12px; text-decoration: none; text-align: right; } .newshop-banner a:hover{ background-color: white; color: lime; } ul.sample{ width:100%; margin-top:20px; font-size:10px; padding-left:0; margin-left:0; } ul.sample li{ list-style-position: outside; background-color: transparent; background-repeat: repeat; background-attachment: scroll; background-position: 0% 0%; background-size: auto auto; background-origin: padding-box; background-clip: border-box; padding-top: 3px; padding-right: 10px; padding-bottom: 3px; padding-left: 10px; width: 120px; float: left; border-width: 2px; border-color: rgb(255, 238, 219); border-style: ridge; } .list-test1{ float: left; list-style-type: none; margin-top: 40px; padding-top: 40px; color: orange; } 【HTML記述】 ----------------------- <div id="manu-nanyo"> <div class="job-menu"> <ul> <li><a href="*">野球</a> <li><a href="*">サッカー</a> <li><a href="*">テニス</a> <li><a href="*">ゴルフ</a> <li><a href="*">バスケ</a> </ul> </div> <div id="newshop_bunner"><img src="img/newstore-img.png" alt="新店舗"> <ul class="newshop-banner"> <li><a href="*"><img src="#">店名○○○○○お店ネーム</a> <li><a href="*"><img src="#">店名○○○○○お店ネーム</a> </ul> <ul class="sample"> <li><a href="#">テスト1</a> <li><a href="#">テスト2</a> <li><a href="#">テスト3</a> <li><a href="#">テスト4</a> <li><a href="#">テスト5</a> </ul> <ul class="list-test1"> <li><a href="#">トップページ</a> <li><a href="#">テストページ1</a> <li><a href="#">テストページ2</a> </ul> </div> ----------------------- .job-menu li　で使った背景画（矢印）・スタイルが、その後 li を使う度に継承されてしまいます。 クラス名やID名を付けてそれぞれの属性を指定すれば分居ができるのかと色々と試してみたのですが旨くいかず・・・ (ul属性・a属性で分けても継承されてしまいます） 試し過ぎて、もう意味が分からなくなってしまって自分では解決出来そうにないので、初歩的なことで申し訳ありませんが、質問をさせて頂きました。 ネット等で調べた感じでは、「クラスを分けて指定すればulの住み分けが出来る」と判断したのですが、そういうことではないのでしょうか？ それとも根本的な何かを履き違えしているのでしょうか？ 宜しくお願い致しますm(_ _)m

SPページでフォームを作っており、以下のソースのように、 selectで複数選択させたいと考えています。 --------------------------------------------------------------------------------------------------- <select name="" id="" multiple="multiple"> <option value="">ここから選択してください（複数選択可）</option> <option value="1">1枚</option> <option value="2">2枚</option> <option value="3">3枚</option> <option value="4">4枚</option> </select> --------------------------------------------------------------------------------------------------- 複数選択はできるのですが、iphoneで確認すると デフォルトのボタンの表示が「0　Items」と表示されます。 それをタップすると下にプルダウンが表示される形です。 このデフォルトの表示を「ここから選択してください（複数選択可）」 に変えたいのですが、初心者で調べてもわかりませんでした・・・。 誰かお知恵を貸して頂ければ幸いです。 よろしくお願い致します。

36歳・女性・ グラフィックデザイナーをしております。 この度、 会社が引っ越す事になりました。 そこで ご挨拶代わりに 取引先などの方々宛の HTML（？）メールを 送る事となり 担当を任されたのですが... 実は、Webデザインは全くの素人でして（社内の人も...）.. やっと現在 HTMLやDreamweaverのオンライン講習で 勉強中な身の上の私には さっぱり！制作方法が分かりません！ 検索したり、 本を探したり...と してみたのですが... どうも「これだ！」なものが見当たりませんでした。 簡潔なものであれば Macのメール・テンプレートを 使用すれば良いのですが.... こちらに添付しましたイメージの ちょっとメルマガみたいな デザインを目指しております。 OKWaveの皆様で どなたか制作方法・もしくは 参考書など...をご存知の方 いらっしゃいませんでしょうか？ 制作方法や 送信の際に気をつける事... 等々・何でも結構でございます。 因に Illustrator・Photoshopは 問題無く使用可能です。 簡単過ぎる問題で誠に恐縮です... 何卒・Web初心者に アドバイスをお願い致します！

SPページでフォームを作っており、以下のソースのように、 selectで複数選択させたいと考えています。 --------------------------------------------------------------------------------------------------- <select name="" id="" multiple="multiple"> <option value="">ここから選択してください（複数選択可）</option> <option value="1">1枚</option> <option value="2">2枚</option> <option value="3">3枚</option> <option value="4">4枚</option> </select> --------------------------------------------------------------------------------------------------- 複数選択はできるのですが、iphoneで確認すると デフォルトのボタンの表示が「0　Items」と表示されます。 それをタップすると下にプルダウンが表示される形です。 このデフォルトの表示を「ここから選択してください（複数選択可）」 に変えたいのですが、初心者で調べてもわかりませんでした・・・。 誰かお知恵を貸して頂ければ幸いです。 よろしくお願い致します。