※ ChatGPTを利用し、要約された質問です(原文:IE用CSSが適用されない)
IE用CSSが適用されない
通常は12pxを指定して、IEのみフォントサイズを11px指定したいのです。
<!DOCTYPE HTML>
<html lang="jp">
<head>
<meta charset="UTF-8">
<title>タイトル</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<!--[if IE]><link rel="stylesheet" type="text/css" href="css/ie.css"><![endif]-->
<style>
body {
background-color:#FFFFFF;
color:#333333;
font: 'Lucida Grande', Verdana, Arial, 'Hiragino Kaku Gothic Pro', Meiryo, 'メイリオ', sans-serif;
}
#figure_main {
font-size:12px;
margin-top:10px;
margin-left:10px;
width:510px;
}
</style>
</head>
<body>
<div id="figure_main">
<div class="box1"> <span>取締役会</span> </div>
<div class="box1"> <span>取締役社長</span> </div>
<div class="box2"> <span>常勤役員会</span> </div>
<div>
<ul>
<li class="list_l">営業局</li>
<li>人材派遣部</li>
</ul>
</div>
</div>
</body>
</html>
HTMLには<!--[if IE]>を記述し、
ie.cssには
@charset "utf-8";
/* CSS Document */
#figure_main {
font-size:11px;
}
と記述しましたが、適用されませんでした。適用されない理由を教えてくださいますか?
宜しくお願いします。
お礼
返事をありがとうございます。 自己解決できました。 原因はie.cssは<link>要素(外部CSSですね)、IE以外は<style>要素で指定していたため、優先指定で<style>要素で反映されたためでした。 <style>要素を<link>要素に代えることで反映されました。