締切済み

HTML.CSSについて

2014/08/09 02:11

マウスを右や左端に持ってくとブラウザが半分になる機能が有りますよね、これを使うと自分のサイトがおかしくなります。どのようにすればなおりますか？ http://imgur.com/VyljUwi.jpg ↓ http://imgur.com/jPDMY8j.jpg 変わったところは、サイトのタイトルが2段になりずれたところテスト１～テスト5のメニューが2段になったところスクロールバーは左端のはずなのに本文が半分しか表示されてない意味がわからない所があれば教えて下さい。

mitsudai328
お礼率55% (41/74)

CSS
回答数1
ありがとう数10

みんなの回答 （1）
専門家の回答

みんなの回答

ORUKA1951
ベストアンサー率45% (5062/11036)

2014/08/09 11:24 回答No.1

＞マウスを右や左端に持ってくとブラウザが半分になる機能が有りますよね、これは分からない・・・　ブラウザの通常の機能としてはありません。　サイトで独自にjavascript入れているか、あなたのブラウザに何のアドオンを入れているのでしょう。　それは兎も角、単純にスタイルシートの書き方が悪くてウィンドウサイズに追随しないだけでしょう。　現在のように同じスクリーンメディア(media="screen")であってもスマホから超幅広ディスプレイのある時代、600px以上でリキッドで製作し、それを越える場合はmediaqueryでスタイルシートを書き換えますので、そのような問題は起きないはずです。　ウェブページをわざわざHTMLを使用して作成するのは、HTMLが【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから HTMLは、どんな環境からもWebの情報を利用できるようにすべきだという方針の下に開発されている。例えば、様々な解像度や色深度のグラフィックディスプレイを持つPCや、携帯電話、モバイル機器、音声入出力機器、帯域が広いコンピュータや狭いコンピュータ、等の環境である。￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［Introduction to HTML 4 (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.2.1 )］より　だからです。　そのようなことが起こらないために、HTML使うのですから。 [サンプル] ★Another HTML Lint - Gateway( http://www.htmllint.net/html-lint/htmllint.html# ) 　のDATAでチェック済みのHTML4.01strict + CSS2.1です。 ★370ox幅以上に対処　スマホの縦置きでも ★印刷にも対応(URLが印刷され、目次は印刷されない ★タブは＿に置換してあるので戻す。 ★HTML5の場合、<div class="header"><div class="section"><div class="nav"><div class="footer">はそれぞれ<header><section><nav><footer>になる。 HTMLは文書構造しか書かれていないので、スタイルシートも分かりやすいし、HTML/CSSの変更も簡単 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> ＿<meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> ＿<title>テストのサイト</title> ＿<meta name="author" content="ORUKA1951"> ＿<meta http-equiv="Content-Style-Type" content="text/css"> ＿<link rev="made" href="mailto:oruka1951@hoge.com" title="send a mail" > ＿<link rel="START" href="../index.html"> ＿<style type="text/css" media="screen">  ＿</style> ＿<style type="text/css" media="print">  ＿</style> </head> <body> ＿<div class="header"> ＿＿<h1>テストのサイト</h1> ＿＿<div class="nav"> ＿＿＿<ul> ＿＿＿＿<li>リンク</li> ＿＿＿＿<li>リンク</li> ＿＿＿＿<li>リンク</li> ＿＿＿＿<li>リンク</li> ＿＿＿＿<li>リンク</li> ＿＿＿</ul> ＿＿</div> ＿</div> ＿<div class="section"> ＿＿<h2>見出し</h2> ＿＿<p>本文はsection</p> ＿＿<p> ＿＿＿こんにちは、こんにちは、こんにちは、こんにちは、こんにちは、こんにちは、こんにちは、こんにちは、こんにちは、こんにちは、こんにちは、こんにちは、こんにちは、＿＿</p> ＿＿<div class="nav" id="contentTable"> ＿＿＿<ul> ＿＿＿＿<li>リンク</li> ＿＿＿＿<li>リンク</li> ＿＿＿＿<li>リンク</li> ＿＿＿＿<li>リンク</li> ＿＿＿＿<li>リンク</li> ＿＿＿</ul> ＿＿</div> ＿</div> ＿<div class="footer"> ＿＿<h2>文書情報</h2> ＿＿<dl class="documentHistry"> ＿＿＿<dt id="FIRST-PUBLISHED">First Published</dt> ＿＿＿<dd>2013-03-03</dd> ＿＿</dl> ＿</div> </body> </html>