みんなの「教えて(疑問・質問)」にみんなで「答える」Q&Aコミュニティ

こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

外部CSSがIEで無反映

Web制作初心者です。

ポートフォリオとしてサイトを2つくらい作ったのですが、2つとも
Google Chromeで表示確認をしていて、出来上がってから
Internet Explorerでも表示確認をしてみたら、IEでは
外部CSSが全く反映されていない状態でした。
何がダメなのか全くわかりません。

お手数ですがご助言お願い致します。


------------HTML-----------------
<!doctype html>
<html>
<head>
<meta charset="text/html; charset=utf-8">
<meta name="descrption" content="">
<meta name="keywords" content="">
<link rel="stylesheet" type="text/style" href="common.css">
<link rel="stylesheet" type="text/style" href="index.css">
<title>
Profile-TOP-
</title>
</head>
<body>

<div id="wrapper">

<!--*************ヘッダー部分*************-->
<div id="header">
<h1>My Profile Site</h1>
<!--ナビゲーション部分-->
<div class="navi">
<ul>
<li class="top">TOP</li>
<li><a href="profile.html">Profile</a></li>
<li><a href="design.html">Design</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div><!--/navi-->
</div><!--/header-->

<!--************コンテンツ部分************-->
<div id="content">
 <a href="profile.html"><img src="images/NY.png" alt="ny"></a>
 <p class="please">↑<br>Please click the image!</p>
 <p class="site">当サイトは私のプロフィールやポートフォリオを掲載しています。</p>
</div><!--/content-->

<!--*************フッター部分*************-->
<div id="footer">
<p>Copyright &copy; 2013 nnn All Rights Reserved.</p>
</div><!--/fotter-->

</div><!--/wrapper-->
</body>
</html>

--------------CSS-----------------
-----common-----

/*----------body部分---------*/
* {
font-family: serif;
}

body,html {
background: url("images/wood_texture4.jpg") ;
color: #ffffcc;
margin: 0;
padding: 0;
line-height: 20px;
height: 100%;
}

img {
border: none;
}

/*--------wrapper--------*/
#wrapper {
width: 900px;
margin: 0 auto;
padding: 0;
}

/*---------header---------*/
#header {
background-color: #000000;
margin: 0;
height: 120px;
padding-top: 1px;
}

h1 {
float: left;
font-size: 40pt;
padding-top: 10px;
padding-left: 30px;
padding-right: 60px;
width: 440px;
margin-top: 0;
margin-right: 30px;
}

.navi ul {
margin-top: 0;
}

.navi ul li {
list-style-type: none;
float: left;
width: 80px;
margin-top: 28px;
margin-right: 2px;
padding: 6px 10px;
text-align: center;
background-color: #151515;
font-weight: bold;
}

a:link {
color: #cccccc;
text-decoration: none;
}

a:visited {
color: #cccccc;
}

a:hover {
color: #ff6600;
}

/*------------content---------------*/
#content {
background-color: #6e6e3c;
clear: left;
color: #000000;
margin: 0;
height: auto;
}

/*-------footer-------*/
#footer {
background-color: #000000;
height: 40px;
padding: 10px;
clear: both;
padding-right: 20px;
margin-top: 0;
margin-bottom: 0;
}

#footer p {
text-align: right;
vertical-align: middle;

}


--------index.css---------

/*content*/
#content img {
position: relative;
left: 50px;
}

p {
text-align: center;
margin-bottom: 0;
}

.please {
color: #ffffff;
font-weight: bold;
font-size: 15pt;
}

.site {
padding-bottom: 20px;
}
/*現在のページナビ*/
.top {
color: #990000;
}

投稿日時 - 2013-02-16 02:22:01

QNo.7947530

すぐに回答ほしいです

質問者が選んだベストアンサー

cssのlink typeのところです。

<link rel="stylesheet" type="text/style" href="common.css">

ではなく

<link rel="stylesheet" type="text/css" href="common.css">

投稿日時 - 2013-02-16 10:06:56

お礼

仰る通りでした!
まさか、丸暗記しておかないといけない基礎の基礎部分が違うだなんて思っても見ませんでした(苦笑
大変助かりました!
ありがとうございました!

投稿日時 - 2013-02-16 10:45:44

ANo.1

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(1)

あなたにオススメの質問