• 締切済み

ホームページの幅なんですが

shokodeiの回答

  • shokodei
  • ベストアンサー率33% (2/6)
回答No.4

個人的には、広すぎだと思いますが、まあソレはソレで。 一点だけ。 3カラムで、その広さだと、ウインドウ有効幅が800px以下(ブラウザのサイドペインを開いてたり)の場合、右側のカラムは表示されません。そして、本文部分がそのまま読めるなら、あえて右側のカラムを見るために、ユーザーは、ウインドウを広げたり、横スクロールしたりはしないので、右側のカラムに重要な項目を記載しない(クリックしてもらいたいモノとか)のは重要なポイントです。 まあ、そう多くはないだろうと、割り切ってもいいんですけど。

関連するQ&A

  • カラムの幅ってどうやって決めていますか?

    2カラムの時は、790pxとかをよく見かけましたけど、最近は全体の幅もバラバラで、2カラム、3カラムとデザインもバラバラ。 あげくにそれぞれの幅もバラバラになっていますが、これって皆さんどうやって幅を決めているのですが? いろいろ調べてはいるのですが、中途半端な数字が多いので、何か計算式にのっとって幅を決定しているのかな? と思い質問させていただきました。 いろいろ教えてください。

    • ベストアンサー
    • HTML
  • illustratorである幅のボックスに均等にバナーを配置したい。

    ある幅のボックスの中にある、サイズが決まってるバナーを均等に間を開けて配置したいのですが、どうしたら良いのでしょうか? 例えば、458pxの幅を持つボックスの中に幅124pxのバナーを3つ配置するとします。それで外側、とバナー同志の間を均等に開けたいのです。 お願いします。

  • ホームページの横幅

    こんにちわ、 今まではホームページを作成するときのサイトの横幅は800pxで作成していたのですが、もう少し大きなサイズで作成したいと思っています。 そこで横幅を大きくするならどれくらいの幅までなら大丈夫でしょうか? それとも横幅は今でも800pxでの作成が望ましいのでしょうか? よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • jQueryで画像の幅と高さをリサイズする方法

    jQueryでサイズが異なる画像の幅と高さをリサイズするのに、非常に困っています。 XMLもしくはJSONで複数画像をサーバーサイドから取得します。その画像の条件は、幅サイズは異なるのですが、高さは一定です。仮に高さを140pxとします。 要件を簡単に述べると、 Webサイトの画⾯幅が900pxとした場合に、画像をその幅にきっちり収まるようにしたい。(1pxや2px程度の空きがでても良い) きっちり収めるためには、画像のリサイズを行わなければならないのですが、各行毎の画像の高さは一定とする。(一行目と二行目の高さは異なってよい。) という感じになっています。 そのリサイズ方法ですが、 画⾯の横幅に取得した画像の先頭から何枚収まるか算出しなければなりません。 仮に以下のような画像の横幅とします。 1枚目:180 2枚目:240 3枚目:120 4枚目:80 5枚目:1000 6枚目:600 7枚目:300 8枚目:500 9枚目: 10枚目: ・ ・ ・ これらの画像横幅を足すと 180 + 240 + 120 + 80 + 1000 = 1620 となるため、画面幅の900を超えてしまいます。 そのため4枚目までしか画面幅に収まりません。なので4枚目までの画像幅を足します。 180 + 240 + 120 + 80 = 620 900(画面幅) ÷ 620(幅総数) x 140(画像の規定高さ) = 203(切り捨て) となり、その行に納まる4枚の画像の高さを203pxにして、それに併せて4枚の画像の幅サイズをリサイズします。 1枚目の画像の場合: 180 × (203 ÷ 140) = 261 2枚目の画像の場合: 240 × (203 ÷ 140) = 348 としていくと、4枚の画像の幅総数が899となり画面幅に収まります。高さは4枚すべて203pxです。 5枚目が1000と900を大幅に超えていますので、この場合以下のように高さをだします。 900 ÷ 1000 × 140 = 126 1000 × (126 ÷ 140) = 900 として幅900px、高さ126pxとリサイズします。 という具合に6枚目、7枚目、8枚目の画像の幅総数が900以内として、 すべての画像のそれぞれ高さと幅をリサイズしていきます。 こういった場合に、画像それぞれの幅を見て、画面幅の収める枚数の画像を決めて、 上記のような条件でリサイズしていけばよいでしょうか。 何卒、力添えをお願い致します。

  • yahooは検索エンジン?

    yahooはポータルサイトですかそれとも 検索エンジンなのでしょうか? 検索エンジンは何を使っているの?の問に Yahoo と答えてました。 ポータルサイトは? もちろん、Yahooです。 しかしながら、検索エンジンとポータルサイトはイコールではないですよね。 gooやGoogleは検索エンジン? yahooは昔gooやGoogleと提携していましたよね。 今Yahooはどこの検索エンジンを使っているのですか? それとも、Yahoo独自のもの? 支離滅裂な質問ですが、きっと、ポータルサイトと検索エンジンの意味がはっきりわかっていないのだと思います。 教えてください。よろしくお願いします。

  • 幅を広げたいのに文字が隠れ(?)る

    下記のように分かれているページがあります。 ┌───────┐ │へっだ      │ ├─┬───┬─┤ │め│めいん│※│ │に│     │  │ │ゅ│     │  │ ├─┴───┴─┤ │ふった      │ └───────┘ 『※』の部分に文字などもなく不自然にスペースができています。 『めいん』の幅以上の文字を入れると、文字が隠れてしまいます。 『※』の部分まで『めいん』を伸ばし、2カラムにしたいのですが、 他所の幅を変更するだけでは解決できず、質問をさせていただきました。 質問部分のコードは下記の通りです。 (ヘッダ・フッタ省略) 【HTML部分】 <!-- メインコンテンツ --> <div id="container"> <div id="contents"> ~省略~ </div> <!-- メインコンテンツ終わり --> <!-- メニュー --> <div id="menu"> ~省略~ </div> <!-- メニュー終わり --> </div> <!-- コンテンツ終わり --> 【CSS部分】 /*---------- コンテンツ ----------*/ #container { width: 1000px; overflow: visible; margin: 0px; padding: 6px; background-color: #ffffff; } /*---------- メインコンテンツ ----------*/ #contents { float: right; margin: 0; padding: 5px 10px 5px 0; font-size: 12px; line-height: 180%; width: 1000px; letter-spacing: 1px; } #contents #pannavi { margin: 0; padding: 0 0 5px 0; font-size: 12px; } #contents h2 { height: 27px; margin: 0 0 4px 0; padding: 8px 0 0 20px; font-size: 12px; color: #333333; background-image: url(img/titlebar.gif); background-repeat: no-repeat; } #contents h3 { margin: 12px 5px 10px 6px; padding: 8px 10px 5px 13px; line-height: 110%; font-size: 13px; color: #444444; border-left: solid 5px #aaaaaa; background-color: #eeeeee; } #contents h19 { margin: 12px 5px 10px 6px; padding: 8px 10px 5px 13px; line-height: 110%; font-size: 13px; color: #444444; border-left: solid 5px #eeeeee; background-color: #eeeeee; } h4,h5 { font-size:18px; font-weight:bold; color:#7e603b; } h7 { font-size:10px; font-weight:lighter; color:#7e603b; } h8 { font-size:13px; font-weight:bold; color:#7e603b; } h9 { font-size:13px; font-weight:bold; color:#cccccc; } h10 { font-size:13px; font-weight:bold; color:#000000; } h11 { font-size:18px; color:#000000; } #contents p { margin: 3px 0 3px 0; padding: 0 5px 0 5px; line-height: 180%; font-size: 12px; } #contents a { color: #c9171e; font-size: 12px; } #contents a:hover { color: #e83929; font-size: 12px; } #contents img.head_photo { margin: 0 0 10px 50px; } #contents img.photo { float: left; margin: 10px 20px 0 0; } #contents img.picture { margin: 0 10px 10px 0; float: left; } #contents p.photo { margin: 0 0 20px 0; padding: 0; } table#t01 { border: solid 1px #999999; border-collapse: collapse; } td#t01 { border: solid 1px #999999; border-collapse: collapse; } td#head { padding: 7px 6px 5px 10px; border: solid 1px #999999; border-collapse: collapse; } table.table_line { border-collapse: collapse; margin : 10px 0 0 0; } td.table_line { border-collapse: collapse; padding : 9px 14px 7px 14px; border-bottom: solid 2px #fffffc; } どうか、ご教授お願いいたします。

    • ベストアンサー
    • CSS
  • 可変幅でabsolute指定で中央配置できません

    可変幅でabsoluteを指定すると中央配置できなくなります。 ブラウザの幅に合わせて中身のサイズも合わせて伸縮するサイトを構築したくて色々試しているのですが、どうしてもうまくできません。 どのように指定したらできるのでしょうか?困っています、どなたかお助けください。 例えば画像が固定のサイズであれば  width:500px; position:absolute; left:50%; margin-left:-250px; 見たいな形で中央配置できるのですが、可変の場合、、伸縮させたいので、横幅は常に500pxとはなりません。 よろしくお願い致します。

    • ベストアンサー
    • CSS
  • ナビゲーションボタンの幅を、ページの幅に合わせたいと考えています。

    ナビゲーションボタンの幅を、ページの幅に合わせたいと考えています。 例えば、ページの幅を800pxとってあり、8個のナビゲーションボタンを設置する場合は、1つ辺り100px。10個の場合ですと、80pxと、均一の幅で、かつページの幅一杯まで占めるような表示をしたいと考えています。 http://solidstate.jp/Navigation/DropdownMenu/script_50.html そこで、上記サイトよりサンプルとして配布されているソースを試しているのですが、widthなりpaddingなりでcss側で調整している状況となっています。 そこで質問なのですが、上記のよなサンプルソースの場合、widthは指定しなくても、ボタンの数に合わせて汎用的にページ幅に沿うようなものは出来ないのでしょうか? サンプルソースのように、多階層が可能なドロップダウンを備えたナビゲーションが欲しく、やっと探し得たのですが、CSSの知識が乏しく困っている状態です。 お忙しいなか恐縮ですが、アドバイスなど頂戴出来れば幸いです。宜しくお願い申し上げます。

    • ベストアンサー
    • HTML
  • スクロールバーの幅設定

    noshioと申します。 サイトの横スクロールバーの幅設定を、任意の数字にすることは出来るのでしょうか? 具体的には、ウィンドウサイズが780px以下になったときにだけ表示するようにしたいのですが。 お分かりになる方、お教え頂ければ嬉しいです。

  • 幅のサイズはそのままで、真ん中に表示させたいのです

    よろしくお願いします。 初心者です。 具体的に「<body></body>の間にこれを入れろ」と言われれば判るという感じです。 使用環境=Win98SE、IE6.0  HPビルダー8で実際にHPを作成し、Web上にUPしています。 が、その【表示方法】を変えたいのです。HPビルダーでは出来ないそうです。 例えばこのgooのTopページは、左側にお気に入りや履歴が入っていれば、ちゃんとあわせて表示してくれて、 逆に、お気に入りや履歴を消してみると、★真ん中★になってくれますよね? 画面の大きさはそのまま。左や右にスペースが出来て。そうしたいのです。 現在は幅750の「標準モード」です。 そのため、左側に履歴などあるとよいのですが、逆に左側に何も無いと「750幅の画面」がただ左によってしまうだけで、バランスが取れません。 以前も質問をしたのですが上手く説明できませんでした。 ★お返事1 まずHP全体のサイズを決めますが、 画面はそれぞれサイズが違うと思います。 そのため px というサイズよりも100% と書いた方がどの画面でもあわせる事が出来ます。 たとえば600の画面でも、1000以上の画面でも100% のサイズが適用されます。 なのでまずstyle で body{width:100%; と書きます。 ↑どこに body{width:100%; と入れればいいのか判りませんでした。 しかもこれだとサイズが変わってしまう? ★お返事2、 私は表示させたいものにはmargin:auto;を… ホームページ全体を真ん中にもっていくには スタイルシートで .naka{width:750px; margin:auto;}にして <body> <div class="naka"> </div> </body> ↑お!これ!と思ったのですが、どこにどうやって入れるのか判らずエラーになってしまいます。 申し訳ありませんが初心者にお教えください。 よろしくおねがいします。