oleg.kan

Проблема с блоками

oleg.kan replied to oleg.kan's question in HTML Coding

спасибо,помогло.

Проблема с блоками

oleg.kan posted a question in HTML Coding

Использовал разные свойства вроде float и display:block но не помогает.В общем ситуация следующая:Есть новость,фоны для заголовка и текста заданы в ячейках таблиц(это нужно,чтобы при увеличении кол-ва текста средний фон растягивался(если у кого-то есть альтернативный вариант пишите)) и еще 1 ячейка в таблицы для нижней части фона и мне нужно,чтобы эти блоки отталкивали футер.Точно такая же фигня со спанами в общем прикладываю код. Хтмл пример со спанами <!doctype html> <html> <head> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="css/styles.css"> <title>B?rnud?rzs R?GELE</title> </head> <div id="wrapper"> <div id="header"> <div id="top_line"> <ul> <li class="left"><a href="#">Главная</a></li> <li class="normal"><a href="#">О нас</a></li> <li class="normal"><a href="#">Детский сад</a></li> <li class="normal"><a href="#">Студии и курсы</a></li> <li class="normal"><a href="#">Летний отдых</a></li> <li class="right"><a href="#">Монтессори</a></li> </ul> </div> <div id="logo"> <div id="nadpis"><img src="img/logo_nadpis.png" width="403" height="78"></div> <div id="photo_1"><img src="img/logo_photo1.png" width="245" height="190"></div> <div id="photo_2"><img src="img/logo_photo2.png" width="245" height="189"></div> <div id="photo_3"><img src="img/logo_photo3.png" width="250" height="188"></div> </div> </div> <div id="content"> <span id="content_title">Новости</span> <span id="content_title">Новости</span> <span id="content_title">Новости</span> <span id="content_title">Новости</span> <span id="content_title">Новости</span> <span id="content_title">Новости</span> <span id="content_title">Новости</span> <span id="content_title">Новости</span> <span id="content_title">Новости</span> <span id="content_title">Новости</span> <span id="content_title">Новости</span>   </div> <div class="clear"></div> <div id="sidebar"> </div> <div class="clear"></div> <div id="footer"> </div> </div> <body> </body> </html> Хтмл пример с новотными блоками <!doctype html> <html> <head> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="css/styles.css"> <title>B?rnud?rzs R?GELE</title> </head> <div id="wrapper"> <div id="header"> <div id="top_line"> <ul> <li class="left"><a href="#">Главная</a></li> <li class="normal"><a href="#">О нас</a></li> <li class="normal"><a href="#">Детский сад</a></li> <li class="normal"><a href="#">Студии и курсы</a></li> <li class="normal"><a href="#">Летний отдых</a></li> <li class="right"><a href="#">Монтессори</a></li> </ul> </div> <div id="logo"> <div id="nadpis"><img src="img/logo_nadpis.png" width="403" height="78"></div> <div id="photo_1"><img src="img/logo_photo1.png" width="245" height="190"></div> <div id="photo_2"><img src="img/logo_photo2.png" width="245" height="189"></div> <div id="photo_3"><img src="img/logo_photo3.png" width="250" height="188"></div> </div> </div> <div id="content"> <span id="content_title">Новости</span> <table class="news"> <tr> <td background="img/news_head.png" width="400" height"40" class="news_header"><span> </span><span class="news_title">16 октября 2012 года в 17:30</span></td> </tr> <tr> <td background="img/news_center.png" width="400" height"1" class="news_center"> <p>Состоится собрание для родителей детей от 0</p> <p>до 3 лет, которые планируют посещать</p> <p>студию "Вместе с мамой" (новая группа) и ещё</p> <p>не был на собрании.</p></td> </tr> <tr> <td background="img/news_footer.png" width="400" height"10" class="news_footer"> </td> </tr> </table> <table class="news"> <tr> <td background="img/news_head.png" width="400" height"40" class="news_header"><span> </span><span class="news_title"><b>Нам исполняется 20 лет!</b></span></td> </tr> <tr> <td background="img/news_center.png" width="400" height"1" class="news_center"> <p>Наш центр начал свою работу 1 сентября 1992</p> <p>года.За эти годы мы вырастили и выпустили</p> <p>много ребятишек. Многие из них уже закончили</p> <p>школу и даже институт.Мы с радостью хотели</p> <p>бы встретиться с нашими выпускниками,их</p> <p>родителями,коллегами,друзьями на празд-</p> <p>-ничном вечере!Желающие принять участие в</p> <p>нашем юбилее – отзовитесь!Предварительная</p> <p>дата встречи- 9 ноября...</p> <img src="news/news 2.JPG" width="327" height="208"> </td> </tr> <tr> <td background="img/news_footer.png" width="400" height"10" class="news_footer"> </td> </tr> </table> </div> <div class="clear"></div> <div id="sidebar"> </div> <div class="clear"></div> <div id="footer"> </div> </div> <body> </body> </html> цсс код @charset "utf-8"; /* CSS Document */ body { margin:0; padding:0; background-image:url(../img/bg.jpg); font-family:Arial, Helvetica, sans-serif; } #wrapper { background-color:#fff; margin-left:15%; margin-right:15%; width:70%; max-width:1010px; height:auto; box-shadow:0 0 62px #fff; moz-box-shadow:0 0 62px #fff; webkit-box-shadow:0 0 62px #fff; filter: progid:DXImageTransform.Microsoft.shadow(direction=90, color=#fff, strength=62px); } .clear { clear:both; } #header { margin:0; padding-top:1px; } /*—————————--Верхняя панель———————————-*/ #top_line { margin:auto; width:99.7%; height:40px; outline:1px solid #999; border:1px solid #fff; background: #ececed; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VjZWNlZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkNWQyZDIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #ececed 0%, #d5d2d2 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ececed), color-stop(100%,#d5d2d2)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ececed 0%,#d5d2d2 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ececed 0%,#d5d2d2 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ececed 0%,#d5d2d2 100%); /* IE10+ */ background: linear-gradient(to bottom, #ececed 0%,#d5d2d2 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ececed', endColorstr='#d5d2d2',GradientType=0 ); /* IE6-8 */ } #top_line ul { list-style:none; width:100%; margin-top:0; margin-left:-40px; } #top_line ul li a { width:160px; height:40px; margin-left:0; float:left; font-size:14pt; color:#333; text-decoration:none; text-align:center; display:table-cell; vertical-align:bottom; padding-top:10px; } li.normal { border-right:1px solid #999; border-left:1px solid #fff; width:160px; height:40px; float:left; } li.right { border-left:1px solid #fff; width:177px; height:40px; float:left; } li.left { border-right:1px solid #999; width:177px; height:40px; float:left; } li:hover { box-shadow:0 0 10px #000; moz-box-shadow:0 0 10px #000; webkit-box-shadow:0 0 10px #000; filter: progid:DXImageTransform.Microsoft.shadow(direction=90, color=#000, strength=10px); } /*—————————--Верхняя панель———————————-*/ /*—————————--Лого———————————-*/ #logo { margin-top:1px; width:100%; height:220px; background: #4e9a06; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRlOWEwNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzczZDIxNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM4YWUyMzQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #4e9a06 0%, #73d216 50%, #8ae234 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4e9a06), color-stop(50%,#73d216), color-stop(100%,#8ae234)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #4e9a06 0%,#73d216 50%,#8ae234 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #4e9a06 0%,#73d216 50%,#8ae234 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #4e9a06 0%,#73d216 50%,#8ae234 100%); /* IE10+ */ background: linear-gradient(to bottom, #4e9a06 0%,#73d216 50%,#8ae234 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4e9a06', endColorstr='#8ae234',GradientType=0 ); /* IE6-8 */ position:relative; } #nadpis { position:absolute; top:70px; z-index:5; } #photo_1 { position:absolute; top:20px; left:370px; z-index:4; } #photo_2 { position:absolute; top:20px; left:550px; z-index:3; } #photo_3 { position:absolute; top:20px; left:740px; z-index:4; } /*—————————--Лого———————————-*/ /*—————————--Контент———————————-*/ #content { width:45%; height:300px; margin-left:3.5%; margin-top:15px; float:left; } #content_title { color:#333; font-size:24pt; text-shadow:0 0 1px #999; margin:0 33%; float:left; display:block; } .news { margin-top:30px; margin-left:5%; position:relative; float:left; } .news_title { color:#000; font-size:15pt; padding-left:15%; } .news_center { position:relative; top:-2px; } .news_text { font-size:13pt; padding:0 15px; } .news_center p { font-size:13pt; padding:0 15px; line-height:3px; } .news_center img { padding:2px 35px; } .news_footer { font-size:6px; position:relative; top:-4px; } /*—————————--Контент———————————-*/ /*—————————--Сайдбар———————————-*/ /*—————————--Сайдбар———————————-*/ /*—————————--Футер———————————-*/ #footer { width:100%; height:80px; background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VjZWNlZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkNWQyZDIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #ececed 0%, #d5d2d2 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ececed), color-stop(100%,#d5d2d2)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ececed 0%,#d5d2d2 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ececed 0%,#d5d2d2 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ececed 0%,#d5d2d2 100%); /* IE10+ */ background: linear-gradient(to bottom, #ececed 0%,#d5d2d2 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ececed', endColorstr='#d5d2d2',GradientType=0 ); /* IE6-8 */ } /*—————————--Футер———————————-*/

Проблема с include

oleg.kan replied to oleg.kan's question in HTML Coding

Решил проблему.Спасибо USF за подсказку по кодировке,а для русского нужно подключать .htaccess файл.Если у кого-то возникнет похожая проблема вот код .htaccess: AddDefaultCharset utf-8 AddCharset utf-8 * <IfModule mod_charset.c> CharsetSourceEnc utf-8 CharsetDefault utf-8 </IfModule>

Проблема с include

oleg.kan replied to oleg.kan's question in HTML Coding

utf-8 Поменял кодировку в Notepad++ на utf-8 без BOM проблема исчезла хотя я удивлён что в Adobe Dreamweaver cs6 у сайта есть выбор кодировки utf-8 но нету utf-8 без BOM но теперь возникла проблема с русским языком.Всё что было написано на русском превратилось в иероглифы.Насколько я знаю utf-8 международная кодировка и должна поддерживать русский. tr повторно не открывается, в теме случайно осталась, уже исправил

Проблема с include

oleg.kan posted a question in HTML Coding

Возникла следующая проблема:если какой-то блок включать инклюдом то появляется пробел если вставить просто код без инклюда то пробела нету не понимаю что за бред не имеет значения вносить элементы таблицы в пхп блок или нет результат один. С инклюдом: index.php : <? include("blocks/bd.php"); ?> <!doctype html> <html> <head> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="styles/main.css"> <title>Документ без названия</title> </head> <body> <table width="690" align="center" class="main_border"> <? include("blocks/header.php"); ?> <tr> <td valign="top" bgcolor="#FFFFFF"><table width="100%" border="1"> <tr> <? include("blocks/left_td.php") ?> <td width="73%"></td> </tr> </table></td> </tr> <? include("blocks/footer.php") ?> </table> </body> </html> main.css : body { background-image:url(../img/bg.jpg); font-family:Verdana,arial; font-size:12px; color:#424242 } .main_border { border:1px solid #000; } .left { background-color:#f6f6f6; border-left:1px solid #424242; } p { font-family:Verdana,arial; font-size:12px; color:#424242 margin:15px; } header.php : <tr> <td bgcolor="#FFFFFF"><img src="img/header.jpg" width="690" height="100"></td> </tr> left_td.php : <td width="27%" class="left"> </td> footer.php: <tr> <td bgcolor="#FFFFFF"><img src="img/footer.jpg" width="690" height="20"></td> </tr> bd.php : <? $db = mysql_connect("localhost","admin","123"); mysql_select_db("phpblog",$db); ?> Без инклюда: index.php <!doctype html> <html> <head> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="styles/main.css"> <title>Документ без названия</title> </head> <body> <table width="690" align="center" class="main_border"> <tr> <td bgcolor="#FFFFFF"><img src="img/header.jpg" width="690" height="100"></td> </tr> <tr> <td valign="top" bgcolor="#FFFFFF"><table width="100%" border="1"> <tr> <td width="27%" class="left"> </td> <td width="73%"></td> </tr> </table></td> </tr> <tr> <td bgcolor="#FFFFFF"><img src="img/footer.jpg" width="690" height="20"></td> </tr> </table> </body> </html> main.css : body { background-image:url(../img/bg.jpg); font-family:Verdana,arial; font-size:12px; color:#424242 } .main_border { border:1px solid #000; } .left { background-color:#f6f6f6; border-left:1px solid #424242; } p { font-family:Verdana,arial; font-size:12px; color:#424242 margin:15px; } P.S:Во всех браузерах отображается одинаково Огромная просьба не писать скинь сайт так как сайт находится на локальном компьютере

резиновый контент

oleg.kan replied to oleg.kan's question in HTML Coding

не могу дать ссылку,так как сайт на локальном сервере.Смысл покупать домен и хостинг если сайт не готов?

резиновый контент

oleg.kan posted a question in HTML Coding

Первая проблема:В последних версиях mozila firefox,IE и последней версии google chrome контент отличается внешним видом.Хотя вроде тегов которые не поддерживают те или иные браузеры не использовал. 1.IE 9 и Mozila Firefox 14 2.Google Chrome 21 Вторая проблема:В IE и Mozila Firefox если уменьшить размер экрана,а затем увеличить,то изображения контента будут нормально уменьшаться и увеличиваться(задана ширина в процентах) а в Google Chrome если уменьшить размер экрана,а затем увеличить,то он зависает в уменьшенном состоянии и развисает после обновления страницы . И у меня есть просьба:может кто помочь с этим контентом.Нужно чтобы он был резиновым и при вставке новых таблиц растягивалась по высоте центральная картинка.ширина контента не должна быть 100%, так как нужно оставить место под колонку Вот код: <div class="wrapper clearfix"> <div id="container"> <table id="ship"> <tr> <td><object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="178" height="144"> <param name="movie" value="swf/goliath_diminisher.swf"> <param name="quality" value="high"> <param name="wmode" value="opaque"> <param name="swfversion" value="9.0.45.0">  <param name="expressinstall" value="Scripts/expressInstall.swf">   <object type="application/x-shockwave-flash" data="swf/goliath_diminisher.swf" width="178" height="144">  <param name="quality" value="high"> <param name="wmode" value="opaque"> <param name="swfversion" value="9.0.45.0"> <param name="expressinstall" value="Scripts/expressInstall.swf">  <div> <h4>Для содержимого этой страницы требуется более новая версия Adobe Flash Player.</h4> <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Получить проигрыватель Adobe Flash Player" /></a></p> </div>  </object>  </object> </td> <td> <p>Сервер:Россия 3</p> <p>Компания:Eic</p> <p>Игровой уровень:19</p> <p>Опыт:2 0000 0000 0000</p> <p>Честь:21 0000 0000</p> </td> </tr> <tr> <td class="iris"><img src="images/auc/IRISrender.png" width=20%><img src="images/auc/IRISrender.png" width=20%><img src="images/auc/IRISrender.png" width=20%><img src="images/auc/IRISrender.png" width=20%></td> <td><p>Прогрессов:39</p></td> </tr> <tr> <td class="iris"><img src="images/auc/IRISrender.png" width=20%><img src="images/auc/IRISrender.png" width=20%><img src="images/auc/IRISrender.png" width=20%><img src="images/auc/IRISrender.png" width=20%></td> <td><p сlass="price">Цена:10 0000 Euro</p></td> </tr> </table> <div><img src="images/bokovaja_verx.png" width=100% height=199px></div> <div><img src="images/bokovaja_centr.png" width=100% height=auto></div> <div><img src="images/bokovaja_niz.png" width=100% height=199px></div> <div id="footer"><img src="images/footer.png" width=100%></div> </div> </div> <script type="text/javascript"> swfobject.registerObject("FlashID"); </script> Вот стили: .wrapper { width: 100%; } #container { float:left; } #footer { margin:3% 5% 0; } table { color:#fff; border:2px solid #fff; text-shadow: black 1px 1px 2px, #fff 0 0 1em; } #ship { position:absolute; margin:2% 5% 100% 4%; } .iris { padding:0 0 0 15%; } table:hover { color:#00B4FF; border:2px solid #00B4FF; text-shadow: black 1px 1px 2px, #00B4FF 0 0 1em; } .price { text-align:center; font-size:12px; font-weight:bold; } #ship_1 { position:absolute; margin:2% 5% 100% 39%; } И картинки контента: bokovaja-verx.png bokovaja-centr.png bokovaja-niz.png

Sign In

Posts

Joined

Last visited

oleg.kan's Achievements

Explorer (1/14)

Reputation

Проблема с блоками

Проблема с блоками

Проблема с include

Проблема с include

Проблема с include

резиновый контент

резиновый контент

Forums

Important Information