Может, transition: none им прописать?

не помогает!

Где можно живой пример посмотреть?

Ri, код подойдет или одеть дневник?

body {background: #bbf9a6;} #Journal, #JournalComments {padding-top: 0; padding-bottom: 0;} #wrapper { width: 1044px; min-width: 975px !important; background: url('/userdir/1/7/2/8/172864/74148047.png') repeat-y; } #extratop {position: relative; display: block !important; background: url('/userdir/1/7/2/8/172864/74121102.png') no-repeat; height: 500px !important; width: 975px !important; left: 35px; } {} #side .bordered {position:relative; left: -345px; height: 550px; width: 200px !important; background: url('/userdir/1/7/2/8/172864/74192543.png') right no-repeat; padding-right: 200px; -moz-transition: all 0.8s ease !important; -webkit-transition: all 0.8s ease !important; -o-transition: all 0.8s ease !important; } #side .bordered:hover {position:relative; left: 0px; height: 550px; width: 200px !important; background: url('/userdir/1/7/2/8/172864/74192543.png') right no-repeat; padding-right: 200px;} #thisDiaryPhoto {position: relative; top: -100px;} #thisDiaryOwner {border: none; position: relative; top: -210px;} #myDiaryLinks {border: none; position: relative; top: -200px;} #globalLinks {border: none; position: relative; top: -270px;} #myLinks {border: none; position: relative; top: -270px;} #Stats {border: none; position: relative; top: -270px;} {} {кнопки} #side h1 a {display:block; position: relative; top: -300px; left: 100px; width: 413px; height: 98px; line-height:300px; overflow:hidden; background: url('/userdir/1/7/2/8/172864/74172680.png') no-repeat; } #side h1 a:hover {display:block; position: relative; top: -300px; left: 100px; width: 413px; height: 98px; line-height:300px; overflow:hidden; background: url('/userdir/1/7/2/8/172864/74172685.png') no-repeat; border-bottom: none;} {} #authorName {display:block; position: relative; top: -400px; left: 200px; height:98px; width: 242px; line-height:500px; overflow:hidden; background: url('/userdir/1/7/2/8/172864/74172690.png') no-repeat; border:none !important; } #authorName:hover {display:block; position: relative; top: -400px; left: 200px; height:98px; width: 242px; line-height:500px; overflow:hidden; background: url('/userdir/1/7/2/8/172864/74172694.png') no-repeat; border:none !important; } {} #mainpageLink a span {display:block; position: relative; top: -290px; left: 570px; height:62px; width: 247px; line-height:500px; overflow:hidden; background: url('/userdir/1/7/2/8/172864/74173056.png') no-repeat; border:none !important; } #mainpageLink a span:hover {display:block; position: relative; top: -290px; left: 570px; height:62px; width: 247px; line-height:500px; overflow:hidden; background: url('/userdir/1/7/2/8/172864/74173060.png') no-repeat; border:none !important; } {} #pchs {display: none;} #lastComments {display:none;} #Stats a+a {display: none; } img{max-width: 750px !important;} #epigraph .singlePost, #post0 {display: none;} #headlineList, #upInChart, #albumLink, #myLinksLink, #allDiaryLink, #pchListLink, #myCommunitiesLink, #randomDiaryLink, #diarySpiritLink, #faqLink, #myDiaryLink, #myProfileLink, #photolibLink, #postsCalendar, #myFavLink, #myQuotLink, #diarySupportLink {display: none; }

Я нашел такое решение:

#side:hover h1 a {
left: -244px;
}
#side h1 a {
-webkit-transition: all 0.8s ease !important;
}

Т.е. говорим, чтобы название дневника ехало в противооложную сторону при наведении на меню. Оно остается на месте, но дрожит. Конечно, нужно добавить префиксы остальных вендоров (moz, o). Для ника аналогично.

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

Ну, это надо отдельно смотреть. У меня ваш код делает страницу абсолютно неработоспособной, на меню сложно нажать, всё мигает и движется куда-то. Так что я даже не понимаю, какого эффекта в целом вы хотите добиться.