ksonline
Newbie-
Posts
20 -
Joined
-
Last visited
ksonline's Achievements
Explorer (1/14)
0
Reputation
-
Разобрался!
-
Привет! Сделал выпадающую гориз. менюшку в Dreamweaver, когда увеличиваешь страницу часть элементов меню прескакивает на новую строку, пробовал различные варианты форматировая, пробовал поместить меню в таблицу ничего не получается (позникают проблемы с JS ) , подскажите что можно сделать в данной ситуации, нужно чтобы меню при изменении масштаба не ломалось...может рецептик какой кто знает? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Документ без названия</title> <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script> <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; } function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; } function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} } </script> </head> <body onload="MM_preloadImages('images/bt_h_on_main.gif','images/bt_h_on_arhierey.gif','images/bt_h_on_eparhiya.gif')"> <ul id="MenuBar1" class="MenuBarHorizontal"> <li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image1','','images/bt_h_on_main.gif',1)"><img src="images/bt_h_main.gif" name="Image1" width="111" height="48" border="0" id="Image1" /></a><a class="MenuBarItemSubmenu" href="#"></a> </li> <li><a href="#"></a><a href="arhierey.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image2','','images/bt_h_on_arhierey.gif',1)"><img src="images/bt_h_arhierey.gif" alt=" " name="Image2" width="110" height="48" border="0" id="Image2" /></a></li> <li><a class="MenuBarItemSubmenu" href="#"></a><a href="eparhia.html " onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image3','','images/bt_h_on_eparhiya.gif',1)"><img src="images/bt_h_eparhiya.gif" alt="" name="Image3" width="94" height="48" border="0" id="Image3" /></a> <ul> <li><a class="MenuBarItemSubmenu" href="#">Элемент 3.1</a> </li> <li><a href="#">Элемент 3.2</a></li> <li><a href="#">Элемент 3.3</a></li> </ul> </li> </ul> <p> </p> <p> </p> <p> </p> </div> <script type="text/javascript"> var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"}); </script> </body> </html> и css файл @charset "UTF-8"; ul.MenuBarHorizontal { margin: 0; padding: 0; list-style-type: none; font-size: 100%; cursor: default; width: auto; } ul.MenuBarActive { z-index: 1000; } ul.MenuBarHorizontal li { margin: 0; padding: 0; list-style-type: none; font-size: 100%; position: relative; text-align: left; cursor: pointer; font-family: Verdana, sans-serif; float: left; } ul.MenuBarHorizontal ul { margin: 0; padding: 0; list-style-type: none; font-size: 100%; z-index: 1020; cursor: default; width: 9em; position: absolute; left: -1000em; top:48px; } ul.MenuBarHorizontal ul.MenuBarSubmenuVisible { left: auto; } ul.MenuBarHorizontal ul li { width: 8.7em; } ul.MenuBarHorizontal ul ul { position: absolute; margin: -5% 0 0 95%; } ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible { left: auto; top: 0; } ul.MenuBarHorizontal ul li a { padding:5%; } ul.MenuBarHorizontal { display: inline; } ul.MenuBarHorizontal a { display: block; cursor: pointer; background-color: #8bbbf1; padding: 0; color:#FFF; text-decoration: none; } ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus { background-color: #6799ca; color: #FFF; } ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible { background-color: #6799ca ; color: #FFF; } ul.MenuBarHorizontal iframe { position: absolute; z-index: 1010; filter:alpha(opacity:0.1); } @media screen, projection { ul.MenuBarHorizontal li.MenuBarItemIE { display: inline; float: left; background: #FFF; } }
-
Благодарю! Отличный материал !
-
Всем привет! Подскажите можно ли сделать навигацию по странице на css, ,(чтобы длинная страница отображалась короче и имела внизу менюшку вперед-назад, дальше и нумерацию 1.2.3. ит.д )? Если да то как? подскажите технологию или где можно прочесть об этом. Заранее благодарен. !
-
Благодарю за ответ! Проблему решил.Тему можно закрыть
-
Привет! Подскажите в чем дело, сделал менюшку на css (не выпадающая,с замещающимся изображением использовал a:hover), в opere, mozille? хроме все норм,в ie 8 пропадает одно изображение (крайнее), а все другие отображаются нормально... Переделал менюшку сделал в DW cs5, редактор сдеалал менюшку на JS? и проблема опять та же.Кто сталкивался с подобным, и как это лечить.? Такой код написал DW <script type="text/javascript"> function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; } function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; } function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} } </script> и html разметка меню <div class="container"> <div class="header"><img src="images/upper_banner.gif" alt="Место для логотипа" name="Insert_logo" width="1148" height="188" id="Insert_logo" style="background" /> <table border="0" cellspacing="0" cellpadding="0" > <tr> <td><a href="index.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image2','','images/bt_h_on_main.gif',1)"><img src="images/bt_h_main.gif" alt="Главная" name="Image2" width="111" height="48" border="0" id="Image2" /></a></td><td><a href="arhierey.htm " onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image3','','images/bt_h_on_arhierey.gif',1)"><img src="images/bt_h_arhierey.gif" alt=" " name="Image3" width="110" height="48" border="0" id="Image3" /></a></td><td><a href="eparhia.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image4','','images/bt_h_on_eparhiya.gif',1)"><img src="images/bt_h_eparhiya.gif" alt=" " name="Image4" width="94" height="48" border="0" id="Image4" /></a></td><td><a href="struktura_otd.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image5','','images/bt_h_on_struktura.gif',1)"><img src="images/bt_h_struktura.gif" alt="Структура отдела" name="Image5" width="175" height="48" border="0" id="Image5" /></a></td><td><a href="katehiz.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image6','','images/bt_h_on_katehiz.gif',1)"><img src="images/bt_h_katehiz.gif" alt=" " name="Image6" width="135" height="48" border="0" id="Image6" /></a></td><td><a href="konferenz.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image7','','images/bt_h_on_konferen.gif',1)"><img src="images/bt_h_konferen.gif" alt="Конференции" name="Image7" width="145" height="48" border="0" id="Image7" /></a></td><td><a href="konkursy.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image8','','images/bt_h_on_konkursy.gif',1)"><img src="images/bt_h_konkursy.gif" alt="Конкурсы" name="Image8" width="110" height="48" border="0" id="Image8" /></a></td><td><a href="video.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image9','','images/bt_h_on_video.gif',1)"><img src="images/bt_h_video.gif" alt="Видео" name="Image9" width="80" height="48" border="0" id="Image9" /></a></td><td><img src="images/h_vstavka.gif" width="41" height="48" /></td><td><a href="voprosy.html " onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image20','','images/bt_h_on_voprosy.gif',1)"><img src="images/bt_h_voprosy.gif" alt="Вопрос-ответ" name="Image20" width="145" height="48" border="0" id="Image20" /></a></td></tr></table> <!-- end .header --></div> а это мое детише ((( фрагмент css a.link_main { background: url(images/bt_h_main.gif); display: block; width: 111px; height: 48px; } a.link_main:hover { background: url(images/bt_h_on_main.gif); } a.link_arhierey { background: url(images/bt_h_arhierey.gif); display: block; width: 111px; height: 48px; } a.link_arhierey:hover { background: url(images/bt_h_on_arhierey.gif); } a.link_eparhiya { background: url(images/bt_h_eparhiya.gif); display: block; width: 94px; height: 48px; } a.link_eparhiya:hover { background: url(images/bt_h_on_eparhiya.gif); } a.link_struktura { background: url(images/bt_h_struktura.gif); display: block; width: 175px; height: 48px; } a.link_struktura:hover { background: url(images/bt_h_on_struktura.gif); } a.link_katehiz { background: url(images/bt_h_katehiz.gif); display: block; width: 135px; height: 48px; } a.link_katehiz:hover { background: url(images/bt_h_on_katehiz.gif); } a.link_konferen { background: url(images/bt_h_konferen.gif); display: block; width: 145px; height: 48px; } a.link_konferen:hover { background: url(images/bt_h_on_konferen.gif); } a.link_konkursy { background: url(images/bt_h_konkursy.gif); display: block; width: 110px; height: 48px; } a.link_konkursy:hover { background: url(images/bt_h_on_konkursy.gif); } a.link_video { background: url(images/bt_h_video.gif); display: block; width: 80px; height: 48px; } a.link_video:hover { background: url(images/bt_h_on_video.gif); } a.link_voprosy { background: url(images/bt_h_voprosy.gif); display: block; width: 145px; height: 48px; } a.link_voprosy:hover { background: url(images/bt_h_on_voprosy.gif); } фрагмент разметки... <body background="images/background.gif" topmargin="0" onLoad="MM_preloadImages('images/bt_on_prav_obrz.gif','images/bt_on_vosk_ school.gif','images/bt_on_eparh_kurs.gif','images/bt_on_prav_gimn.gif','images/bt_on_osn_kultury.gif','images/bt_on_vyshee_obrz.gif','images/bt_on_shcool_obrz.gif','images/bt_on_do_shcool_obrz.gif')"> <div class="box" id="box"> <div class="banner" id="banner"><img src="images/upper_banner.gif" width="1148" height="188"> <table border="0" cellspacing="0" cellpadding="0" > <tr> <td><a href="index.html" class="link_main"></a> </td> <td><a href="arhierey.html" class="link_arhierey"></a> </td> <td><a href="/eparhiya.htm" class="link_eparhiya"></a> </td> <td><a href="/struktura_otdela.htm" class="link_struktura"></a> </td> <td><a href="/katehizacia.htm" class="link_katehiz"></a> </td> <td><a href="/konferen.htm" class="link_konferen"></a> </td> <td><a href="/konkursy.htm" class="link_konkursy"></a> </td> <td><a href="/video.htm" class="link_video"></a> </td> <td><img src="images/h_vstavka.gif" width="42" height="48"></td><td><a href="/voprosy.htm" class="link_voprosy"></a></td></tr> </table>
-
Я извиняюсь забыл указать что менюшки, не выпадающие , а использующие смену графических файлов при наведении мыши, использовал a:hover... как показать не знаю , нужно высылать index файл с граф элементами... а html страничка вот ).. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title> </title> <style type="text/css"> BODY { margin : 0; padding: 0; } .box { width:1146px; color: #FFF; height:960px; margin-left: auto; margin-right: auto; margin-top :0; margin-bottom:0; } #banner { line-height: 0; margin-bottom:0; } #v_menu { height:661px; width:270px; float:left; margin-left:11px; padding-top:0; padding-top:4px; background:white; } a img { border: none; } a.link_main { background: url(images/bt_h_main.gif); display: block; width: 111px; height: 48px; } a.link_main:hover { background: url(images/bt_h_on_main.gif); } a.link_arhierey { background: url(images/bt_h_arhierey.gif); display: block; width: 111px; height: 48px; } a.link_arhierey:hover { background: url(images/bt_h_on_arhierey.gif); } a.link_eparhiya { background: url(images/bt_h_eparhiya.gif); display: block; width: 94px; height: 48px; } a.link_eparhiya:hover { background: url(images/bt_h_on_eparhiya.gif); } a.link_struktura { background: url(images/bt_h_struktura.gif); display: block; width: 175px; height: 48px; } a.link_struktura:hover { background: url(images/bt_h_on_struktura.gif); } a.link_katehiz { background: url(images/bt_h_katehiz.gif); display: block; width: 135px; height: 48px; } a.link_katehiz:hover { background: url(images/bt_h_on_katehiz.gif); } a.link_konferen { background: url(images/bt_h_konferen.gif); display: block; width: 145px; height: 48px; } a.link_konferen:hover { background: url(images/bt_h_on_konferen.gif); } a.link_konkursy { background: url(images/bt_h_konkursy.gif); display: block; width: 110px; height: 48px; } a.link_konkursy:hover { background: url(images/bt_h_on_konkursy.gif); } a.link_video { background: url(images/bt_h_video.gif); display: block; width: 80px; height: 48px; } a.link_video:hover { background: url(images/bt_h_on_video.gif); } a.link_voprosy { background: url(images/bt_h_voprosy.gif); display: block; width: 145px; height: 48px; } a.link_voprosy:hover { background: url(images/bt_h_on_voprosy.gif); } #info_area { width:auto; height:659px; margin-left:277px; margin-top: 0; background:white; padding-top:4px; } #slideshow { height: 296px; width:822px; background-color:white; border: 4px solid #debd8a; margin-left:10px; padding-top:7px; -webkit-box-shadow: 7px 7px 5px #E0DFE4; -moz-box-shadow: 7px 7px 5px #E0DFE4; box-shadow: 7px 7px 5px #E0DFE4; } #bottom_menu { height:45px; background-color:#6799ca; margin-left:11px; margin-top:8px; } #news_area { width:830px; height:332px; margin-left:10px; margin-top:18px; background-color:white; } #head_news { background-color: #8bbbf1; height: 48px; } #anons_head { background-color: #8bbbf1; height: 47px; width:263px; margin-left:4px; margin-top:3px; } body,td,th { font-family: Verdana, Geneva, sans-serif; color: #333; } .searh_box { position: relative; z-index: 200; margin-top: 12px; margin-left:76px; padding:0; } </style> <script type="text/javascript"> function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; } function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; } function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} } </script> </head> <body background="images/background.gif" topmargin="0" onLoad="MM_preloadImages('images/bt_on_prav_obrz.gif','images/bt_on_vosk_ school.gif','images/bt_on_eparh_kurs.gif','images/bt_on_prav_gimn.gif','images/bt_on_osn_kultury.gif','images/bt_on_vyshee_obrz.gif','images/bt_on_shcool_obrz.gif','images/bt_on_do_shcool_obrz.gif')"> <div class="box" id="box"> <div class="banner" id="banner"><img src="images/upper_banner.gif" width="1148" height="188"> <table border="0" cellspacing="0" cellpadding="0" > <tr> <td><a href="index.html" class="link_main"></a> </td> <td><a href="arhierey.html" class="link_arhierey"></a> </td> <td><a href="/eparhiya.htm" class="link_eparhiya"></a> </td> <td><a href="/struktura_otdela.htm" class="link_struktura"></a> </td> <td><a href="/katehizacia.htm" class="link_katehiz"></a> </td> <td><a href="/konferen.htm" class="link_konferen"></a> </td> <td><a href="/konkursy.htm" class="link_konkursy"></a> </td> <td><a href="/video.htm" class="link_video"></a> </td> <td><img src="images/h_vstavka.gif" width="42" height="48"></td><td><a href="/voprosy.htm" class="link_voprosy"></a> </td> </tr> </table> </div> <div class="v_menu" id="v_menu"> <a href="./prav_obrz.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image13','','images/bt_on_prav_obrz.gif',1)"><img src="images/bt_prav_obrz.gif" alt="Православное образование" name="Image13" width="270" height="55" border="0"></a><a href="vosk_school.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image5','','images/bt_on_vosk_ school.gif',1)"><img src="images/bt_vosk_ school.gif" alt="Воскресные школы" name="Image5" width="270" height="53" border="0"></a><a href="eparh_kursy.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image6','','images/bt_on_eparh_kurs.gif',1)"><img src="images/bt_eparh_kurs.gif" alt="Епархиальные курсы" name="Image6" width="270" height="54" border="0"></a><a href="prav_gimnz.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image7','','images/bt_on_prav_gimn.gif',1)"><img src="images/bt_prav_gimn.gif" alt="Православная гимназия" name="Image7" width="270" height="53" border="0"></a><a href="osn_kultury.html " onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image8','','images/bt_on_osn_kultury.gif',1)"><img src="images/bt_osn_kultury.gif" alt="Основы православной культуры" name="Image8" width="270" height="53" border="0"></a><a href="vyshee_obrz.html " onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image9','','images/bt_on_vyshee_obrz.gif',1)"><img src="images/bt_vyshee_obrz.gif" alt="Высшее образование" name="Image9" width="270" height="51" border="0"></a><a href="scholl_obrz.html " onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image10','','images/bt_on_shcool_obrz.gif',1)"><img src="images/bt_shcool_obrz.gif" alt="Школьное образование" name="Image10" width="270" height="53" border="0"></a><a href="do_school" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image11','','images/bt_on_do_shcool_obrz.gif',1)"><img src="images/bt_do_shcool_obrz.gif" alt="Дошкольное образование" name="Image11" width="270" height="51" border="0"></a><br> <div class="anons_head " id="anons_head"><img src="images/bt_anonsy.gif" width="91" height="66" alt="Анонсы"></div> </div> <div class="info_area" id="info_area"> <div class="slideshow" id="slideshow"> </div> <div class="news_area" id="news_area"> <div class="head_news" id="head_news"><img src="images/bt_news.gif" width="104" height="66" alt="Новости"> </div> </div> </div> <div class="bottom_menu" id="bottom_menu"> <img src="images/search.gif" width="76" height="52"> <input type="search" name="search" id="search" class="search"></div> </div> </div> </div> </body> </html>
-
Всем привет !Сделал страничку одно меню написал на css , а второе сдела с помощью dreamweaver (dw написал его на javascript). Как лушче оставить как есть или сделать чтобы оба меню были однотипной технологии.И что лучше менюшка сделанная на css или JS?
-
Спасибо.буду писать ,а со временем выработается опыт покажет как лучше
-
Благодарю! воспользуюсь вашим советом id изменю ... если не трудно поделитесь опытом , как лучше именовать id чтобы оно отличалось от свойства class ... меня всегда этот момент смущал, но я не знал как лучше поэтому писал одинково...
-
огромное спасибо за подсказку.да я имел ввиду встроенный просмотрщик, в нем и видно это расхождение...Во всех 4 основных браузерах все ok~! Вы меня успокоили... а как быть с версткой текста и прочего контента в правой сьехавшей колонке? ее ширина сейчас около 600px это меньше положенного . А в браузерах как надо...быть может учше задать для #info_area фиксированную ширину , сейчас стоит auto.?
-
Всем привет! Подскажите где я допустил ошибку при верстке макета, в браузерах отображается нормально, а в dreamweaver почему то правая колон ка отспупает от левой на ширину левой колонки. Да и в правой колонке стали появляться проблемы с расположением элементов.Сам проверял не один раз но увы... <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title> </title> <style type="text/css"> BODY { margin : 0; padding: 0; } .box { width:1146px; color: #FFF; height:980px; margin-left: auto; margin-right: auto; margin-top :0; } #banner { line-height: 0; margin-bottom:0; } #v_menu { height:665px; width:270px; float:left; margin-left:11px; padding-top:0; margin-top:0; background:white; } a img { border: none; } a.link_main { background: url(images/bt_h_main.gif); display: block; width: 111px; height: 48px; } a.link_main:hover { background: url(images/bt_h_on_main.gif); } a.link_arhierey { background: url(images/bt_h_arhierey.gif); display: block; width: 111px; height: 48px; } a.link_arhierey:hover { background: url(images/bt_h_on_arhierey.gif); } a.link_eparhiya { background: url(images/bt_h_eparhiya.gif); display: block; width: 95px; height: 48px; } a.link_eparhiya:hover { background: url(images/bt_h_on_eparhiya.gif); } a.link_struktura { background: url(images/bt_h_struktura.gif); display: block; width: 175px; height: 48px; } a.link_struktura:hover { background: url(images/bt_h_on_struktura.gif); } a.link_katehiz { background: url(images/bt_h_katehiz.gif); display: block; width: 135px; height: 48px; } a.link_katehiz:hover { background: url(images/bt_h_on_katehiz.gif); } a.link_konferen { background: url(images/bt_h_konferen.gif); display: block; width: 145px; height: 48px; } a.link_konferen:hover { background: url(images/bt_h_on_konferen.gif); } a.link_konkursy { background: url(images/bt_h_konkursy.gif); display: block; width: 110px; height: 48px; } a.link_konkursy:hover { background: url(images/bt_h_on_konkursy.gif); } a.link_video { background: url(images/bt_h_video.gif); display: block; width: 80px; height: 48px; } a.link_video:hover { background: url(images/bt_h_on_video.gif); } a.link_voprosy { background: url(images/bt_h_voprosy.gif); display: block; width: 187px; height: 48px; } a.link_voprosy:hover { background: url(images/bt_h_on_voprosy.gif); } #info_area { width:auto; height:659px; margin-left:277px; margin-top: 0; background:grey; padding-top:4px; } #slideshow { height: 296px; width:822px; background-color:white; border: 4px solid #debd8a; margin-left:10px; padding-top:7px; } #bottom_panel { height:45px; background-color:#6799ca; margin-left:11px; margin-top:8px; } #news_area { width:830px; height:332px; margin-left:10px; margin-top:18px; background-color:white; } #head_news { background-color: #8bbbf1; height: 48px; } #anons_head { background-color: #8bbbf1; height: 47px; } #search { margin-top:10px; margin-left:75px; } </style> </head> <body background="images/background.gif" topmargin="0"> <div class="box" id="box"> <div class="banner" id="banner"><img src="images/upper_banner.gif" width="1148" height="188"> <table border="0" cellspacing="0" cellpadding="0" > <tr> <td><a href="index.html" class="link_main"></a> </td> <td><a href="arhierey.html" class="link_arhierey"></a> </td> <td><a href="/eparhiya.htm" class="link_eparhiya"></a> </td> <td><a href="/struktura_otdela.htm" class="link_struktura"></a> </td> <td><a href="/katehizacia.htm" class="link_katehiz"></a> </td> <td><a href="/konferen.htm" class="link_konferen"></a> </td> <td><a href="/konkursy.htm" class="link_konkursy"></a> </td> <td><a href="/video.htm" class="link_video"></a> </td> <td><a href="/voprosy.htm" class="link_voprosy"></a> </td> </tr> </table> </div> <div class="v_menu" id="v_menu"> <img src="images/v_menu_head.gif" width="270" height="55" alt=" "><br> <a href="/voskres_shcool.htm"> <img src="images/bt_vosk_ school.gif" width="270" height="53"></a><br> <a href="/eparh_kurs"> <img src="images/bt_eparh_kurs.gif" width="270" height="54" alt=" "></a><br> <a href="/prav_gimn"> <img src="images/bt_prav_gimn.gif" width="270" height="53" alt=" "></a><br> <a href="/osn_prav_kultury"> <img src="images/bt_osn_kultury.gif" width="270" height="53" alt=" "></a><br> <a href="/vyshee_obraz.htm "> <img src="images/bt_vyshee_obrz.gif" width="270" height="51" alt=""></a><br> <a href="/shcoll_obrz.htm"> <img src="images/bt_shcool_obrz.gif" width="270" height="53" alt=" "></a><br> <a href="/do_shcoll_obrz.htm "> <img src="images/bt_do_shcool_obrz.gif" width="270" height="51" alt=" "></a><br> </p> <div class="anons_head " id="anons_head"><img src="images/bt_anonsy.gif" width="91" height="66" alt=" "></div> </div> <div class="info_area" id="info_area"> <div class="slideshow" id="slideshow"> </div> <div class="news_area" id="news_area"> <div class="head_news" id="head_news"><img src="images/bt_news.gif" width="104" height="66" alt="Новости"> </div> </div> </div> <div class="bottom_panel" id="bottom_panel"> <input type="search" name="search" id="search" class="search"> </div> </div> </div> </div> </body> </html>
-
Всем спасибо! Нашел нужное слайдшоу , переработал под "себя" , осталось его внедрить в страничку , но это совсем другая история....
-
Спасибо за помощь! скачал jquery , меняю элементы как мне надо , правда не оч получается..
-
Да вы правы я несколько наивно рассудил...что кто то подскажет мне готовый скрипт,буду пока искать.Спасибо за ответ. Описанные вами шаги мне не подойдут,ситуация несколько проще чем вы описали, сайт на html,на главной странице разхмещается слайдшоу,работает автопрокрутка и справа от слайдшоу отображаются коменты к фото...