почему выпадающее меню не работает?
.menu3 li ul {
\tdisplay:none
}
\t
.menu3:hover
{
\twidth:auto;
\theight:68px;
\tbackground-color:#53e4c8;
\tfloat:left;
\tpadding:10px;
\tcolor:#ff522f;
\tfont-family:Arial, Helvetica, sans-serif;
\tfont-size:16;
}

.menu3 a:hover {
\tcolor:#d7785b;
\ttext-decoration:none;
}

.menu3 hover:ul {
\tdisplay:block;
\tbackground-color:#53e4c8;
\t
}

вебаны, в общем есть сайт, контент которого должен отображать посередине окна браузера. и есть следующий код, который с этой задачей успешно справляется если бы не одно НО. Несмотря на то, что в .html указано margin 0, если свернуть окно браузера по максимуму все равно есть отступ слева. Видимо, это из-за того, что в wrapper указан margin: auto. Как сделать так, чтобы и контеyт посередке был и отступов уродских не было?

.outer {
margin:0 220px 0 220px;
zoom:1;
}

.outer:after {
content:'';
clear:both;
display:block;
overflow:hidden;
height:0;
}

.boxCL {
float:left;
width:100%;
zoom:1;
}

.centerCol {
float:right;
width:100%;
zoom:1;
}

.leftCol {
float:left;
width:200px;
position:relative;
margin-left:-220px;
zoom:1;
}

.rightCol {
float:right;
width:200px;
position:relative;
margin-right:-220px;
zoom:1;
}

хуяч тут http://cssdeck.com/labs

есть такое
<nav role='navigation'>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">News</a></li>
<li><a href="#">Project</a>
<ul>
<li><a href="">Android app</a></li>
<li><a href="">Hand Made</a></li>
</ul>
</li>
<li><a href="#">Contact</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Reviews</a></li>
</ul>
</nav>

+ такое
@import url(http://fonts.googleapis.com/css?family=Lato);

, :before, :after{
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0;
margin: 0;
font-family: 'Lato', sans-serif;
}

/| Navigation |/

nav{
position: fixed;
top: 0;
left: 0;
width: 100%;
background: #f2f2f2;
box-shadow: 0 3px 10px -2px rgba(0,0,0,.1);
border: 0px solid rgba(0,0,0,.1);
}
nav ul{
list-style: none;
position: relative;
float: right;
margin-right: 100px;
display: inline-table;
}

nav ul li{
float: left;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}

nav ul li:hover{background: rgba(34,175,71,.99);}
nav ul li:hover > ul{display: block;}
nav ul li{
float: left;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
nav ul li a{
display: block;
padding: 10px 40px; /расстояние между словами/
color: #535353;
font-size: .9em;
letter-spacing: 1px;
text-decoration: none;
text-transform: uppercase;
}
nav ul ul{
display: none;
background: #f2f2f2;
position: absolute;
top: 100%;
box-shadow: -0px 0px 0px -0px rgba(0,0,0,.1);
border: 0px solid rgba(0,0,0,.1);
}
nav ul ul li{float: none; position: relative;}
nav ul ul li a {
padding: 15px 20.5px; /высота, ширина выпадающего блока*/
border-bottom: 0px solid rgba(0,0,0,.05);
}
nav ul ul ul {
position: absolute;
left: 100%;
top:0;
}\t


где нужно докрутить, чтобы цвет текста менялся, при наведении курсора?

дорогой веб столкнулся с такой ситуацией

есть допустим вот такое

<section id="section-2">
\t<div class="img-line" id="img-1"></div>
\t<div class="img-line" id="img-2"></div>
\t<div class="img-line" id="img-3"></div>
\t<div class="img-line" id="img-4"></div>
</section>
и еще много всего в JS
$('.img-line').hover(function hoverOn(){
\t\thovered = this.id;
\t\t$('.img-line').width(oneImgW/10020);
\t\t$('#'+hovered).width(sWidth/10080);
\t},function hoverOut(){
\t\t$('.img-line').width(sWidth/4);
\t});
суть в том, что при наведении картинка увеличевается остальные уменшьаются.
хотел впилить анимацию (да, работало, но криво)
т.к. приходится сначало уменьшать все четыре элемента, а потом нужный увеличивать.

суть в чем
хочу "ШТУКУ", которая переберет мне все элементы с классом .img-line и будет сравнивать их атрибут ИД с this.id(наведенного элемента), и если
$('.img-line').attr('id') != this.id то уменьшать

я отупел уже 2 часа бьюсь над этим
не могу додумать как с while сделать или $.each()
ПЖАЛСТА АНОН!!! помоги мне

Анон, взываю к тебе.
Почему див с постами не вмещается в див контента, а вылезает за него?
Html-код:
<div id="content">
\t\t<div id="slider">
\t\t<ul id="cycle">
\t\t\t<li><img src="<?php bloginfo('template_url'); ?>/Image/IMG_7286.JPG" height="300" width="1170" alt="Slides" /></li>
\t\t\t<li><img src="<?php bloginfo('template_url'); ?>/Image/DSC09071.jpg" height="300" width="1170" alt="Slides" /></li>
\t\t\t<li><img src="<?php bloginfo('template_url'); ?>/Image/IMG_5414.JPG" height="300" width="1170" alt="Slides" /></li>
\t\t
\t\t</ul>
\t\t<div id="cyclePager"></div>
\t</div>

\t\t<div class="text3">
<?php if (have_posts()): while (have_posts()): the_post(); ?>
<div class="text1">
\t <h1><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>&nbsp;<span><?php the_date_xml(); ?></span></h1>
<div class="text2"> <?php the_excerpt(); ?> <p><a href="<?php the_permalink(); ?>">Читать далее</a></p> </div>
</div>
<?php endwhile;
posts_nav_link();
endif; ?>
</div>

\t\t<div id="contacti">
<table id="contacti1">
<tr><td id="contacti2">Телефон -<br>077413819</td></tr>
<tr>
<td width="90px" height="90px"><img src="<?php bloginfo('template_url'); ?>/Image/vk-1.png" width="74" height="74" alt="vk" /></td><td><img src="<?php bloginfo('template_url'); ?>/Image/лицекнига.png" width="74" height="74" alt="fb" /></td></tr>
<tr><td><img src="<?php bloginfo('template_url'); ?>/Image/твиттер.png" width="74" height="74" alt="twitter" /></td><td><img src="<?php bloginfo('template_url'); ?>/Image/тытруба-1.png" width="74" height="74" alt="youtube" /></td></tr>
</table>
<div id="poisk">
<input type="search" size="15px">
<input type="submit" value="искать"/>
</div>
\t\t</div>
\t\t</div>
\t\t</div>
\t\t</div>
CSS
#content
{
\twidth:1170px;
\tmin-height:990px;
\tbackground-color:#e1f9fe;
\tborder-radius: 0px 0px 5px 5px;
\tmargin:auto;
\tmargin-top:44px;
position:relative;
\t
}

#gallery
{
\tmax-width:1170px;
\theight:300px;
\tbackground-color: grey;
}

#karta
{
\tfloat:left;
\twidth: 401px;
\theight:672px;
\tpadding-top:5px;
\tpadding-left:5
}
#zapiska
{
\tfont-family:Verdana, Geneva, sans-serif;
\tpadding:5px;
\tpadding-left:0px;
\ttext-align:center;
}
#text{
\twidth:545px;
\theight:672px;
\tfloat:left;
}
.text1
{
\twidth:700px;
\tfloat:left;
\tmargin-left:10px;
\tmargin-top:10px;
\tborder: 1px solid #16a085;
\tborder-radius:8px;
position:relative;
}
.text3
{
\twidth:700px;
\tfloat:left;
\tmargin-right:226px;
min-height:990px;
\t
}
.text1 h1
{
\tbackground-color:#1abc9c;
\tfont-family: "Times New Roman";
\tfont-style:normal;
\tfont-size:24px;
\tcolor:#000;
\tborder-radius: 8px 8px 0px 0px;
\tpadding:5px 20px 8px 15px;
}
.imgstyle{
\tfloat:left;
\tmargin:10px;
}
.text1 h1 span
{
\tfont:Verdana;
\tfont-size:12px;
}
.text1 h1 a
{
\ttext-decoration:none;
\tcolor:#000;
\t
}
.text1 h1 a:hover
{
\ttext-decoration:underline;
\tcolor:#000;
\t
}
.text2
{
\tmargin:0px 15px 15px 15px;
\tfloat:left;
}
.text2 p
{
\tfont-size:12px;
\tfont-family:Verdana, Geneva, sans-serif;
\tmargin:0px 0px 15px 0px}
\t.text2 p a
{
\ttext-decoration:underline;
\tcolor: #000}
\t.text2 p a:hover
{
\ttext-decoration:none;
\tcolor:#ff522f;}
#contacti
{
\theight:672px;
\twidth:224px;
\tfloat:left;
\tbackground-color:#ff522f;
\tpadding:0px;
}
#contacti2
{
\tpadding-bottom:15px;
\tcolor:#ffa998;
\tfont:Arial, Helvetica, sans-serif;
\tfont-size:18px;
}
\t\t
#contacti1
{
\tborder-collapse:collapse;
\tborder-width:20px;
\tmargin-left:20px;
\tmargin-top:15px;
}
#poisk
{
\tmargin:10px;
\tmargin-top:20px;
\ttext-align:center
}