CSS стиль изменяет дизайн сайта

user

Здравствуйте.
Подскажите пожалуйста, как сделать так что бы css стили не реагировали на весь сайт?
Т.е. Есть меню и стиль для меню и когда вставляю меню в сайт, то все буквы на сайте увеличиваются.
Как сделать так чтобы css стили реагировали только на меню?

HTML-код


	Код: <link href="upmenu/menu.css" rel="stylesheet" type="text/css" /> <body> <div id="wrap"> <nav id="menu-wrap"> <ul id="menu"> <li><a href="">Главная</a></li> <li> <a href="">✰ Мега Звёзды ✰</a> <ul> <li><a href="http://nyusha.ru/" target="_blank">Нюша/Nyusha</a></li> <li><a href="http://www.mileycyrus.com/" target="_blank">Miley Cyrus</a></li> </li> </ul> <!-- <li> <a href="">Статьи</a> <ul> <li> <a href="">Пункт 1</a> <ul> <li> <a href="">Пункт 11</a> <ul> <li><a href="">Пункт 111</a></li> <li><a href="">Пункт 112</a></li> <li><a href="">Пункт 113</a></li> </ul> </li> <li> <a href="">Пункт 12</a> <ul> <li><a href="">Пункт 121</a></li> <li><a href="">Пункт 122</a></li> <li><a href="">Пункт 123</a></li> </ul> </li> <li> <a href="">Пункт 13</a> <ul> <li><a href="">Пункт 131</a></li> <li><a href="">Пункт 132</a></li> <li><a href="">Пункт 133</a></li> </ul> </li> </ul> </li> <li> <a href="">Пункт 2</a> <ul> <li> <a href="">Пункт 21</a> <ul> <li><a href="">Пункт 211</a></li> <li><a href="">Пункт 212</a></li> <li><a href="">Пункт 213</a></li> </ul> </li> <li> <a href="">Пункт 22</a> <ul> <li><a href="">Пункт 221</a></li> <li><a href="">Пункт 222</a></li> <li><a href="">Пункт 223</a></li> </ul> </li> <li> <a href="">Пункт 23</a> <ul> <li><a href="">Пункт 231</a></li> <li><a href="">Пункт 232</a></li> <li><a href="">Пункт 233</a></li> </ul> </li> </ul> </li> <li> <a href="">Пункт 3</a> <ul> <li> <a href="">Пункт 31</a> <ul> <li><a href="">Пункт 311</a></li> <li><a href="">Пункт 312</a></li> <li><a href="">Пункт 313</a></li> </ul> </li> <li> <a href="">Пункт 32</a> <ul> <li><a href="">Пункт 321</a></li> <li><a href="">Пункт 322</a></li> <li><a href="">Пункт 323</a></li> </ul> </li> <li> <a href="">Пункт 33</a> <ul> <li><a href="">Пункт 331</a></li> <li><a href="">Пункт 332</a></li> <li><a href="">Пункт 333</a></li> </ul> </li> </ul> </li> </ul> </li> <li><a href="">О Сайте</a></li> <li><a href="">Контакты</a></li> </ul> --> </nav> </div> </body>

CSS-код


	Код: body { font: 18px Helvetica, Arial, Sans-Serif; } h1 a { display: block; text-decoration: none; font: 72px Helvetica, Arial, Sans-Serif; letter-spacing: -5px; text-align: center; color: #999; text-shadow: 0px 3px 8px #2a2a2a; } h1 a:hover { color: #a0a0a0; text-shadow: 0px 5px 8px #2a2a2a; } h2 { font: 28px Tahoma, Helvetica, Arial, Sans-Serif; text-align: center; color: #222; text-shadow: 0px 2px 3px #555; } #wrap { width: 960px; margin: 0px auto 0px; padding: 0px; } /* Стили Меню / #menu, #menu ul { margin: 0; padding: 0; list-style: none; } #menu { width: 960px; margin: 5px auto; border: 1px solid #222; background-color: #111; background-image: -moz-linear-gradient(#444, #111); background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111)); background-image: -webkit-linear-gradient(#444, #111); background-image: -o-linear-gradient(#444, #111); background-image: -ms-linear-gradient(#444, #111); background-image: linear-gradient(#444, #111); -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset; -webkit-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset; box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset; } #menu:before, #menu:after { content: ""; display: table; } #menu:after { clear: both; } #menu { zoom:1; } #menu li { float: left; border-right: 1px solid #222; -moz-box-shadow: 1px 0 0 #444; -webkit-box-shadow: 1px 0 0 #000000; box-shadow: 1px 0 0 #00000; position: relative; } #menu a { float: left; padding: 12px 30px; color: #999; text-transform: uppercase; font: bold 12px Arial, Helvetica; text-decoration: none; text-shadow: 0 1px 0 #000; } #menu li:hover > a { color: #fafafa; } html #menu li a:hover { /* IE6 only / color: #fafafa; } #menu ul { margin: 20px 0 0 0; _margin: 0; /IE6 only/ opacity: 0; visibility: hidden; position: absolute; top: 38px; left: 0; z-index: 1; background: #444; background: -moz-linear-gradient(#444, #111); background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111)); background: -webkit-linear-gradient(#444, #111); background: -o-linear-gradient(#444, #111); background: -ms-linear-gradient(#444, #111); background: linear-gradient(#444, #111); -moz-box-shadow: 0 -1px rgba(255,255,255,.3); -webkit-box-shadow: 0 -1px 0 rgba(255,255,255,.3); box-shadow: 0 -1px 0 rgba(255,255,255,.3); -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } #menu li:hover > ul { opacity: 1; visibility: visible; margin: 0; } #menu ul ul { top: 0; left: 150px; margin: 0 0 0 20px; _margin: 0; /IE6 only/ -moz-box-shadow: -1px 0 0 rgba(255,255,255,.3); -webkit-box-shadow: -1px 0 0 rgba(255,255,255,.3); box-shadow: -1px 0 0 rgba(255,255,255,.3); } #menu ul li { float: none; display: block; border: 0; _line-height: 0; /IE6 only/ -moz-box-shadow: 0 1px 0 #111, 0 2px 0 #666; -webkit-box-shadow: 0 1px 0 #111, 0 2px 0 #666; box-shadow: 0 1px 0 #111, 0 2px 0 #666; } #menu ul li:last-child { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } #menu ul a { padding: 10px; width: 130px; _height: 10px; /IE6 only*/ display: block; white-space: nowrap; float: none; text-transform: none; } #menu ul a:hover { background-color: #ffa500; background-image: -moz-linear-gradient(#ffa500, #ffa500); background-image: -webkit-gradient(linear, left top, left bottom, from(#ffa500), to(#ffa500)); background-image: -webkit-linear-gradient(#ffa500, #ffa500); background-image: -o-linear-gradient(#ffa500, #ffa500); background-image: -ms-linear-gradient(#ffa500, #ffa500); background-image: linear-gradient(#ffa500, #ffa500); } #menu ul li:first-child > a { -moz-border-radius: 3px 3px 0 0; -webkit-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; } #menu ul li:first-child > a:after { content: ''; position: absolute; left: 40px; top: -6px; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid #444; } #menu ul ul li:first-child a:after { left: -6px; top: 50%; margin-top: -6px; border-left: 0; border-bottom: 6px solid transparent; border-top: 6px solid transparent; border-right: 6px solid #3b3b3b; } #menu ul li:first-child a:hover:after { border-bottom-color: #04acec; } #menu ul ul li:first-child a:hover:after { border-right-color: #0299d3; border-bottom-color: transparent; } #menu ul li:last-child > a { -moz-border-radius: 0 0 3px 3px; -webkit-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; }

Активные темы

Вопросы и ответы

CSS стиль изменяет дизайн сайта

Кто сейчас на конференции