За последние 24 часа нас посетил 17261 программист и 1646 роботов. Сейчас ищут 1683 программиста ...

Сложные вложенные таблицы (верстка)

Тема в разделе "HTML и CSS", создана пользователем Yuric, 23 окт 2006.

  1. Yuric

    Yuric Активный пользователь

    С нами с:
    23 окт 2006
    Сообщения:
    3
    Симпатии:
    0
    Добрый день!

    У меня на сайте есть страничка новостей, там вставлен скрипт PHP. Делал в Macromedia Dreamweaver 8. На главной страничке все нормально, но когда я нажимаю подробнее, что бы прочитать новость полностью справа и слева таблица начинает разъезжаться. Может, кто знает, как с этим бороться? Ставил, что бы и справа и слева таблицы были резиновыми, не помогает. :(
    Код (Text):
    1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    2. "http://www.w3.org/TR/html4/loose.dtd">
    3. <html>
    4. <head>
    5. <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
    6. <title>Антек Про - поставщик лицензионного программного обеспечения</title>
    7. <link href="http://antec.kiev.ua/favicon.ico" rel="shortcut icon">
    8. <style type="text/css">
    9. <!--
    10. .style1 {
    11.     font-family: Tahoma;
    12.     font-size: 20px;
    13.     color: #996633;
    14. }
    15. .style4 {
    16.     color: #FFFFFF;
    17.     font-family: Tahoma;
    18.     font-size: 10px;
    19. }
    20. .style6 {color: #FFFFFF}
    21. -->
    22. </style>
    23. </head>
    24.  
    25. <body>
    26. <BODY STYLE="scrollbar-3d-light-color: #F4F5F6;scrollbar-arrow-color: #F4F5F6;scrollbar-base-color: #F4F5F6;scrollbar-dark-shadow-color: #8C969F;scrollbar-face-color: #8C969F;scrollbar-highlight-color: #8C969F;scrollbar-shadow-color: #F4F5F6;scrollbar-track-color: #F4F5F6;">
    27. <table width="100%" border="0" cellpadding="0" cellspacing="0">
    28.   <!--DWLayoutTable-->
    29.   <tr>
    30.     <td height="42" colspan="3" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" background="image/1_3.gif">
    31.       <!--DWLayoutTable-->
    32.       <tr>
    33.         <td width="642" height="42">&nbsp;</td>
    34.         </tr>
    35.     </table></td>
    36.     <td width="45" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
    37.       <!--DWLayoutTable-->
    38.       <tr>
    39.         <td width="45" height="42" valign="middle" background="image/1_3.gif"><a href="index.html" target="_self"><img src="image/img1.gif" alt="На главную страницу" width="15" height="12" border="0"></a></td>
    40.         </tr>
    41.     </table></td>
    42.     <td colspan="2" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
    43.       <!--DWLayoutTable-->
    44.       <tr>
    45.         <td width="44" height="42" valign="middle" background="image/1_3.gif"><a href="map.html" target="_self"><img src="image/img2.gif" alt="Карта сайта" width="15" height="10" border="0"></a></td>
    46.       </tr>
    47.     </table>    </td>
    48.     <td colspan="2" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
    49.       <!--DWLayoutTable-->
    50.       <tr>
    51.         <td width="62" height="42" valign="middle" background="image/1_3.gif"><a href="mailto:yura@antec.carrier.kiev.ua"><img src="image/img3.gif" alt="Контакт" width="15" height="12" border="0"></a></td>
    52.         </tr>
    53.     </table></td>
    54.   </tr>
    55.   <tr>
    56.     <td height="144" colspan="4" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
    57.       <!--DWLayoutTable-->
    58.       <tr>
    59.         <td width="668" height="144" background="image/fon5-2.jpg">&nbsp;</td>
    60.         </tr>
    61.     </table></td>
    62.     <td colspan="4" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
    63.       <!--DWLayoutTable-->
    64.       <tr>
    65.         <td width="136" height="144" background="image/2-1.gif">&nbsp;</td>
    66.         </tr>
    67.     </table></td>
    68.   </tr>
    69.   <tr>
    70.     <td width="181" height="354" valign="top"><table width="100%" border="2" cellpadding="0" cellspacing="0">
    71.       <!--DWLayoutTable-->
    72.       <tr>
    73.         <td width="175" height="228" valign="top"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="175" height="230">
    74.           <param name="movie" value="flash/menu.swf">
    75.           <param name="quality" value="high">
    76.           <embed src="flash/menu.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="175" height="230"></embed>
    77.           </object></td>
    78.         </tr>
    79.       <tr>
    80.         <td height="118" valign="middle" background="image/bac-2.jpg"><div style=" padding-left:5px; padding-top:18px">
    81.           <img src="image/bac-2.jpg" width="18" height="17" align="top">
    82.           <input name="textfield" type="text" style=" height:16px; width:80px; border-style:solid; border-width:1px; border-color:B3B2B2; background-color:D2D2D2; font-size:11px">
    83.           <img src="company/images/spacer.gif" width="5" height="1"><a href="#"><img src="image/w22.jpg" width="22" height="15" border="0" align="middle"></a></div></td>
    84.         </tr>
    85.      
    86.     </table></td>
    87.     <td colspan="6" rowspan="2" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
    88.       <!--DWLayoutTable-->
    89.       <tr>
    90.         <td width="608" height="583" align="center" valign="top" background="image/bac.jpg"><p>&nbsp;</p>
    91.             <p class="style1">Новости</p>
    92.           <p>&nbsp;</p>          <link href="http://www.antec.kiev.ua/tsbnews/data/work.css" rel="stylesheet" type="text/css"><link href="http://www.antec.kiev.ua/tsbnews/skin_style.css" rel="stylesheet" type="text/css"><link href="http://www.antec.kiev.ua/tsbnews/other_style.css" rel="stylesheet" type="text/css"> <script>
    93.       function checkcomform(form) {
    94.               if (form.com_body.value=="") { alert("Надо бы написать что-нибудь... ;)"); form.com_body.focus(); return false;}
    95.       }
    96.  
    97.       function show_id(url) {
    98.               link = prompt("Ссылка на новость:",url);
    99.       }
    100.  
    101.       function ins_comtag(tag) {
    102.         document.addcomments.com_body.focus();
    103.         document.addcomments.com_body.value += "["+tag+"][/"+tag+"] ";
    104.         return false;
    105.       }
    106.     </script>
    107.     <script src='http://www.antec.kiev.ua/tsbnews/functions.js'></script><a name='top'></a>
    108. <table border=0 class='pt' cellpadding=0 cellspacing=0 style='font-family:verdana;font-size:12px;'>
    109.        
    110.       <tr>
    111.         <td class='top'>
    112.             <table border=0 cellpadding=0 cellspacing=0>
    113.                 <tr>
    114.                     <td class='date' nowrap>
    115.                         <b>20.10.06&nbsp;</b>
    116.                     </td>
    117.                     <td class='theme'>
    118.                         Антивирус Касперского 6.0 получает награду "Выбор редакции" американского издания CNET
    119.                     </td>
    120.                 </tr>
    121.             </table>
    122.         </td>
    123.       </tr>
    124.       <tr>
    125.         <td class='news'>
    126.             <img src='http://www.antec.kiev.ua/tsbnews/upload/cnet_editorschoice_oct2006.jpg' align='left' alt=''><br />Лаборатория Касперского» удостоилась награды ведущего американского компьютерного онлайн-портала CNET за продукт Антивирус Касперского 6.0, который, по мнению экспертов издания, устанавливает стандарт защиты потребителей от вирусов, троянских и шпионских программ, червей, руткитов и фишинга.<br /><br />Престижнейшая в IT-индустрии награда CNET Editors’ Choice Award ("Выбор редакции") присуждается технологическим и потребительским продуктам, предлагающим лучшее качество, производительность, дизайн и функциональность. Кроме того, приз, присуждаемый редакцией CNET, считается индикатором выгодности инвестиций в данный продукт и рекомендацией к его приобретению.<br /><br />Продукты, отмеченные «Выбором Редакции CNET», признаются лучшими в своих категориях и устанавливают планку качества, по которой оцениваются все последующие продукты. Ключевым критерием при выборе победителя является то, насколько сильно предлагаемое решение меняет жизнь своих пользователей в лучшую сторону. При этом учитываются такие факторы, как, например, инновации, соотношение цены и качества, простота использования продукта.<br /><br />Антивирус Касперского 6.0 сочетает традиционные методы защиты от вирусов с новейшими технологиями проактивной защиты, которые обеспечивают не имеющую аналогов по надежности защиту от вредоносных программ. Продукт прост в установке и освоении и легко настраивается под индивидуальные потребности каждого пользователя. По словам членов жюри CNET, «Антивирус Касперского 6.0 – лучшее антивирусное приложение, которое мы видели в этом году. По результатам тестов производительности, проведенных специалистами как CNET, так и независимых организаций, антивирусные решения «Лаборатории Касперского» опережают по производительности аналогичные продукты своих всемирно известных конкурентов».<br /><br />«Мы очень гордимся качеством своих продуктов и высокими стандартами, которые устанавливает наша вирусная лаборатория, - говорит Стив Оренберг, президент американского офиса «Лаборатории Касперского». – Награда CNET Editors' Choice Award является международным знаком технологического качества и инновационности, и мы очень рады признанию наших достижений в разработке лучших в мире на сегодняшний день технологий по обеспечению информационной безопасности».<br /><br />
    127.         </td>
    128.       </tr>
    129.       <tr>
    130.         <td align='right' style='color:#C0C0C0;font-size:10px;font-family:verdana;'>
    131.            
    132.         </td>
    133.       </tr>
    134.       <tr>
    135.         <td align='right'>
    136.           <font style='font-size:11;font-family:verdana;'>
    137.           &nbsp;<a href='http://www.antec.kiev.ua/index.php?postid=1#top' title='Получить прямую ссылку на новость' onclick='show_id("http://www.antec.kiev.ua/index.php?postid=1#top");return false;'>ID</a>
    138.          
    139.          
    140.           </font>
    141.         </td>
    142.       </tr>
    143.       <tr>
    144.         <td class='separate'><font style='font-size:1;'>&nbsp;</td>
    145.       </tr>
    146.    
    147.         <tr>
    148.             <td>
    149.                 <hr>
    150.                 <font style='font-size:12;font-family:verdana;'>
    151.                 <a name='comments'></a>
    152.         <div align=right>
    153.         <a href='http://www.antec.kiev.ua/index.php?'>Назад к новостям</a>
    154.        
    155.         <br />
    156.         <a href='http://www.antec.kiev.ua/tsbnews/print.php?postid=1' target='_blank'>Версия для печати</a>
    157.                 </div>
    158.             </td>
    159.         </tr>
    160.     <tr><td>&nbsp;</td></tr>
    161.     <tr>
    162.         <td align='center'>
    163.             <font style='font-family:verdana;font-size:10px;color:gray;'>&copy; Powered by <a href='http://tsbs.ru/' style='color:gray;font-size:10px;'>TSB News</a> v.1.1beta5</font>
    164.         </td>
    165.     </tr>
    166.   <tr>
    167.     <td>
    168.      
    169.     </td>
    170.   </tr>
    171. </table></td>
    172.         </tr>
    173.     </table></td>
    174.     <td width="100%" rowspan="2" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
    175.       <!--DWLayoutTable-->
    176.       <tr>
    177.         <td width="35" height="583" valign="top" background="image/bac.jpg"><!--DWLayoutEmptyCell-->&nbsp;</td>
    178.         </tr>
    179.     </table></td>
    180.   </tr>
    181.   <tr>
    182.     <td height="229" valign="top"><table width="100%" border="2" cellpadding="0" cellspacing="0">
    183.       <!--DWLayoutTable-->
    184.       <tr>
    185.         <td width="175" height="225" align="center" valign="top" background="image/bac-2.jpg"><table border=0 cellspacing=0 cellpadding=0 style="border:1px solid ;"><tr class="theme"><td class="top" style="width:150;text-align:center;;" colspan=7>октябрь&nbsp;2006</td></tr><tr><td align=center class='cald'>Пн</td><td align=center class='cald'>Вт</td><td align=center class='cald'>Ср</td><td align=center class='cald'>Чт</td><td align=center class='cald'>Пт</td><td align=center class='cald'>Сб</td><td align=center class='cald'>Вс</td></tr><tr><td class='cald'>&nbsp;</td><td class='cald'>&nbsp;</td><td class='cald'>&nbsp;</td><td class='cald'>&nbsp;</td><td class='cald'>&nbsp;</td><td class='cald'>&nbsp;</td><td align=center class='cald'><a href='?d=01102006' class='links' title='Новости за 01.10.2006'>1</a></td></tr><tr><td align=center class='cald'><a href='?d=02102006' class='links' title='Новости за 02.10.2006'>2</a></td><td align=center class='cald'><a href='?d=03102006' class='links' title='Новости за 03.10.2006'>3</a></td><td align=center class='cald'><a href='?d=04102006' class='links' title='Новости за 04.10.2006'>4</a></td><td align=center class='cald'><a href='?d=05102006' class='links' title='Новости за 05.10.2006'>5</a></td><td align=center class='cald'><a href='?d=06102006' class='links' title='Новости за 06.10.2006'>6</a></td><td align=center class='cald'><a href='?d=07102006' class='links' title='Новости за 07.10.2006'>7</a></td><td align=center class='cald'><a href='?d=08102006' class='links' title='Новости за 08.10.2006'>8</a></td></tr><tr><td align=center class='cald'><a href='?d=09102006' class='links' title='Новости за 09.10.2006'>9</a></td><td align=center class='cald'><a href='?d=10102006' class='links' title='Новости за 10.10.2006'>10</a></td><td align=center class='cald'><a href='?d=11102006' class='links' title='Новости за 11.10.2006'>11</a></td><td align=center class='cald'><a href='?d=12102006' class='links' title='Новости за 12.10.2006'>12</a></td><td align=center class='cald'><a href='?d=13102006' class='links' title='Новости за 13.10.2006'>13</a></td><td align=center class='cald'><a href='?d=14102006' class='links' title='Новости за 14.10.2006'>14</a></td><td align=center class='cald'><a href='?d=15102006' class='links' title='Новости за 15.10.2006'>15</a></td></tr><tr><td align=center class='cald'><a href='?d=16102006' class='links' title='Новости за 16.10.2006'>16</a></td><td align=center class='cald'><a href='?d=17102006' class='links' title='Новости за 17.10.2006'>17</a></td><td align=center class='cald'><a href='?d=18102006' class='links' title='Новости за 18.10.2006'>18</a></td><td align=center class='cald'><a href='?d=19102006' class='links' title='Новости за 19.10.2006'>19</a></td><td align=center class='calpost'><a href='?d=20102006' class='links' title='Новости за 20.10.2006'>20</a></td><td align=center class='cald'><a href='?d=21102006' class='links' title='Новости за 21.10.2006'>21</a></td><td align=center class='cald'><a href='?d=22102006' class='links' title='Новости за 22.10.2006'>22</a></td></tr><tr><td align=center class='caltoday'><a href='?d=23102006' class='links' title='Новости за 23.10.2006'>23</a></td><td align=center class='cald'><a href='?d=24102006' class='links' title='Новости за 24.10.2006'>24</a></td><td align=center class='cald'><a href='?d=25102006' class='links' title='Новости за 25.10.2006'>25</a></td><td align=center class='cald'><a href='?d=26102006' class='links' title='Новости за 26.10.2006'>26</a></td><td align=center class='cald'><a href='?d=27102006' class='links' title='Новости за 27.10.2006'>27</a></td><td align=center class='cald'><a href='?d=28102006' class='links' title='Новости за 28.10.2006'>28</a></td><td align=center class='cald'><a href='?d=29102006' class='links' title='Новости за 29.10.2006'>29</a></td></tr><tr><td align=center class='cald'><a href='?d=30102006' class='links' title='Новости за 30.10.2006'>30</a></td><td align=center class='cald'><a href='?d=31102006' class='links' title='Новости за 31.10.2006'>31</a></td></tr>
    186. <tr>
    187.   <td colspan=3 class="calm">&nbsp;<a href="?m=092006" class="links"><сентябрь</a></td><td class="calm">&nbsp;</td><td colspan=3 class="calm" align="right">&nbsp;</td></tr></table></td>
    188.       </tr>
    189.     </table>    </td>
    190.   </tr>
    191.  
    192.   <tr>
    193.     <td height="18" colspan="8" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" background="image/down.jpg">
    194.       <!--DWLayoutTable-->
    195.       <tr>
    196.         <td width="823" height="18">&nbsp;</td>
    197.         </tr>
    198.     </table></td>
    199.   </tr>
    200.   <tr>
    201.     <td height="27" colspan="2" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
    202.       <!--DWLayoutTable-->
    203.       <tr>
    204.         <td width="241" height="27" background="image/1.gif"></td>
    205.         </tr>
    206.     </table></td>
    207.     <td colspan="2" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
    208.       <!--DWLayoutTable-->
    209.       <tr>
    210.         <td width="446" height="27" valign="top" background="image/1.gif"><a href="company2.html" target="_self"><img src="image/cnopka-bel1.jpg" alt="О компании" width="86" height="26" border="0"></a><a href="index.php" target="_self"><img src="image/cnopka-bel2.jpg" alt="Новости" width="61" height="26" border="0"></a><a href="SHOP/index.php" target="_self"><img src="image/cnopka-bel3.jpg" alt="Магазин" width="56" height="26" border="0"></a><a href="support.php" target="_self"><img src="image/cnopka-bel4.jpg" alt="Поддержка" width="72" height="26" border="0"></a><a href="contact.html" target="_self"><img src="image/cnopka-bel5.jpg" alt="Контакты" width="67" height="26" border="0"></a><a href="customer2.html" target="_self"><img src="image/cnopka-bel6.jpg" alt="Наши клиенты" width="96" height="26" border="0"></a></td>
    211.         </tr>
    212.      
    213.     </table></td>
    214.     <td colspan="4" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" background="image/1.gif">
    215.       <!--DWLayoutTable-->
    216.       <tr>
    217.         <td width="106" height="27">&nbsp;</td>
    218.         </tr>
    219.     </table></td>
    220.   </tr>
    221.  
    222.  
    223.   <tr>
    224.     <td height="34" colspan="2" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
    225.       <!--DWLayoutTable-->
    226.       <tr>
    227.         <td width="241" height="34" valign="top" background="image/1.gif"><!--DWLayoutEmptyCell-->&nbsp;</td>
    228.       </tr>
    229.     </table>    </td>
    230.     <td colspan="3" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
    231.       <!--DWLayoutTable-->
    232.       <tr>
    233.         <td width="461" height="34" align="center" valign="top" background="image/1.gif"><span class="style4">АНТЕК ПРО &copy; 2006 <img src="image/bg_1_14.gif" width="1" height="24"> <span class="style6">Developer Yurii Zakharov</span></span></td>
    234.       </tr>
    235.     </table>    </td>
    236.     <td colspan="3" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
    237.       <!--DWLayoutTable-->
    238.       <tr>
    239.         <td width="91" height="34" valign="top" background="image/1.gif"><!--DWLayoutEmptyCell-->&nbsp;</td>
    240.         </tr>
    241.     </table></td>
    242.   </tr>
    243.       <tr><td height="1"><img src="spacer.gif" alt="" width="181" height="1"></td>
    244.     <td width="60"><img src="spacer.gif" alt="" width="60" height="1"></td>
    245.     <td width="401"><img src="spacer.gif" alt="" width="401" height="1"></td>
    246.     <td><img src="spacer.gif" alt="" width="45" height="1"></td>
    247.     <td width="15"><img src="spacer.gif" alt="" width="15" height="1"></td>
    248.     <td width="29"><img src="spacer.gif" alt="" width="29" height="1"></td>
    249.     <td width="58"><img src="spacer.gif" alt="" width="58" height="1"></td>
    250.     <td></td>
    251.   </tr>
    252. </table>
    253. </body>
    254. </html>
    [​IMG]
    [​IMG]
     
  2. Anonymous

    Anonymous Guest

    //В следующий раз называйте тему внятно, и форматируйте код.
     
  3. AlexGousev

    AlexGousev Активный пользователь

    С нами с:
    25 мар 2006
    Сообщения:
    1.505
    Симпатии:
    0
    Адрес:
    Москва
    Уж сколько раз твердили миру - Internet Explorer отвратительно работает с colspan и rowspan. Описание бага: http://asupport.ru/exp/bugs/rowspan.html
     
  4. Anonymous

    Anonymous Guest

    AlexGousev, уж сколько раз твердили миру - в некоторых случаях блочная верстка практичней табличной =) Как например, в этом =)
     
  5. Yuric

    Yuric Активный пользователь

    С нами с:
    23 окт 2006
    Сообщения:
    3
    Симпатии:
    0
    Если я правильно понял, то моя ошибка в том, что я использовал colspan и rowspan?
     
  6. Anonymous

    Anonymous Guest

    Yuric, это не совсем ваша ошибка... просто IE не совсем адекватно отрабатывает эти аттрибуты.
     
  7. Davil

    Davil Guest

    Yuric w3c уже давно рекоммендуют использовать CSS. Это практичнее.
     
  8. vasa_c

    vasa_c Активный пользователь

    С нами с:
    22 мар 2006
    Сообщения:
    1.760
    Симпатии:
    0
    Адрес:
    гор.Ленинград
    Davil, а причем тут css?
     
  9. Davil

    Davil Guest

     
  10. AlexGousev

    AlexGousev Активный пользователь

    С нами с:
    25 мар 2006
    Сообщения:
    1.505
    Симпатии:
    0
    Адрес:
    Москва
    Это когда верстка простая и блоков мало... Сколько я не пытался делать на блоках, но IE5.0 и IE5.5 еще довольно много, а еще много Opera 7,8,9, плюс FireFox, собака, соблюдает стандарт w3c в том, что качается padding: приходится делать вложенные блоки. Короче, вложенные таблицы пока самый надежный вариант.
     
  11. AlexGousev

    AlexGousev Активный пользователь

    С нами с:
    25 мар 2006
    Сообщения:
    1.505
    Симпатии:
    0
    Адрес:
    Москва
    Ошибка в незнании этого бага в ИЕ. Вложенные таблицы спасут отца российской демократии.
     
  12. Demon

    Demon Активный пользователь

    С нами с:
    20 апр 2006
    Сообщения:
    239
    Симпатии:
    0
    Yuric: На мой взгляд, так лучше и ничего не должно разъезжаться.

    Код (Text):
    1.  
    2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    3.  
    4. <html>
    5. <head>
    6. <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
    7. <style type="text/css">
    8. <!--
    9. #main {
    10. width: 100%;
    11. height: auto;
    12. }
    13. #top-header {
    14. width: 100%;
    15. height: 38px;
    16. background: url('http://www.antec.kiev.ua/image/1_3.gif') repeat-x;
    17. }
    18. #top-header img {
    19. float: right;
    20. border: 0;
    21. margin-left: 5px;
    22. vertical-align: middle;
    23. margin-top: 10px !important;
    24. }
    25. #header {
    26. width: 100%;
    27. height: 150px;
    28. background: url('http://www.antec.kiev.ua/image/2-1.gif') repeat-x;
    29. }
    30. #content {
    31. background: red url('http://www.antec.kiev.ua/image/bac.jpg');
    32. height: 90%;
    33. }
    34. #menu {
    35. width: 187px;
    36. float: left;
    37. height: 100%;
    38. }
    39. #swf {
    40. width: 177px;
    41. height: 230px;
    42. }
    43. #search {
    44. width: 173px;
    45. height: 45px;
    46. border: 1px solid #B3B2B2;
    47. background-color: D2D2D2;
    48. font-size:11px
    49. }
    50. #search input {
    51. border: 1px solid #B3B2B2;
    52. font-size: 11px;
    53. margin-right: 3px;
    54. margin-left: 3px;
    55. }
    56. #bottom {
    57. height: 70px;
    58. float: left;
    59. width: 100%;
    60. background: #8C969F url('http://www.antec.kiev.ua/image/down.jpg') repeat-x;
    61. }
    62. #bottom img {
    63. margin-top: 6px;
    64. }
    65. #copyrights {
    66. width: 100%;
    67. float: left;
    68. height: 15px;
    69. font-family: "Verdana";
    70. font-size: 11px;
    71. text-align: center;
    72. }
    73. #news {
    74. float: left;
    75. width: 80%;
    76. margin-left: 187px;
    77. position: absolute;
    78. }
    79. #ext {
    80. font-family: "Verdana" !important;
    81. font-size: 11px;
    82. width: 90%;
    83. background-color: silver;
    84. margin-left: 4px;
    85. text-align: right;
    86. }
    87. #head {
    88. width: 90%;
    89. height: 30px;
    90. background-color: #8C969F;
    91. margin-left: 4px;
    92. margin-top: 4px;
    93. font-family: "Verdana";
    94. font-size: 11px;
    95. line-height: 3;
    96. }
    97. #text {
    98. width: 90%;
    99. background-color: white;
    100. font-family: "Verdana";
    101. font-size: 11px;
    102. margin-left: 4px;
    103. padding-left: 2px;
    104. }
    105. #inner {
    106. width: 400px;
    107. }
    108. #title {
    109. width: 100px;
    110. height: 40px;
    111. }
    112. #calendar {
    113. width: 170px;
    114. padding-left: 5px;
    115. height: 250px;
    116. padding-top: 10px;
    117. background: url('http://www.antec.kiev.ua/image/bac-2.jpg');
    118. }
    119. #calendar  table {
    120. border: 1px solid black;
    121. }
    122. #calendar table tr td {
    123. border: 1px solid white;
    124. font-family: "Verdana";
    125. font-size: 11px;
    126. text-align: center;
    127. background: url('http://www.antec.kiev.ua/image/bac-2.jpg') no-repeat;
    128. }
    129. table td {
    130. font-size: 11px;
    131. font-familly: georgia;
    132. text-align: center;
    133. text-valign: middle;
    134. width: 20px;
    135. height: 20px;
    136. border-bottom: 1px solid #dfdfdf;
    137. border-right: 1px solid #dfdfdf;
    138. border-top: 1px solid white;
    139. border-left: 1px solid white;
    140. }
    141. p {
    142. font-family: Tahoma;
    143. font-size: 20px;
    144. color: #996633;
    145. }
    146. -->
    147. </style>
    148.  
    149. <title>Page title</title>
    150. </head>
    151. <body>
    152. <div id="main">
    153. <div id="top-header">
    154. <a href="#"><img src="http://www.antec.kiev.ua/image/img1.gif" alt="" /></a>
    155. <a href="#"><img src="http://www.antec.kiev.ua/image/img2.gif" alt="" /></a>
    156. <a href="#"><img src="http://www.antec.kiev.ua/image/img3.gif" alt="" /></a>
    157. </div>
    158. <div id="header"><img src="http://www.antec.kiev.ua/image/fon5-2.jpg" alt="" /></div>
    159. <div id="content">
    160. <div id="menu">
    161. <div id="swf">
    162. <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="175" height="230">
    163. <param name="movie" value="http://www.antec.kiev.ua/flash/menu.swf">
    164. <param name="quality" value="high">
    165. <embed src="http://www.antec.kiev.ua/flash/menu.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="175" height="230">
    166. </object>
    167. </div>
    168. <div id="search">
    169. <br />
    170. <input name="textfield" type="text">
    171. <a href="#"><img src="http://www.antec.kiev.ua/image/w22.jpg" width="22" height="15" border="0" /></a>
    172. </div>
    173. <div id="calendar">
    174. <table border="0" cellspacing="0" cellpadding="0">
    175. <tr>
    176. <td class="top" colspan="7">октябрь&nbsp;2006</td>
    177. </tr>
    178. <tr>
    179. <td align=center >Пн</td>
    180. <td align=center >Вт</td>
    181. <td align=center >Ср</td>
    182. <td align=center >Чт</td>
    183. <td align=center >Пт</td>
    184. <td align=center >Сб</td>
    185. <td align=center >Вс</td>
    186. </tr>
    187. <tr>
    188. <td >&nbsp;</td>
    189. <td >&nbsp;</td><td >&nbsp;</td>
    190. <td >&nbsp;</td><td >&nbsp;</td>
    191. <td >&nbsp;</td><td align=center >
    192. <a href='?d=01102006' class='links' title='Новости за 01.10.2006'>1</a></td>
    193. </tr>
    194. <tr id="numbers">
    195. <td align=center ><a href='?d=02102006' class='links' title='Новости за 02.10.2006'>2</a></td>
    196. <td align=center ><a href='?d=03102006' class='links' title='Новости за 03.10.2006'>3</a></td>
    197. <td align=center ><a href='?d=04102006' class='links' title='Новости за 04.10.2006'>4</a></td>
    198. <td align=center ><a href='?d=05102006' class='links' title='Новости за 05.10.2006'>5</a></td>
    199. <td align=center ><a href='?d=06102006' class='links' title='Новости за 06.10.2006'>6</a></td>
    200. <td align=center ><a href='?d=07102006' class='links' title='Новости за 07.10.2006'>7</a></td>
    201. <td align=center ><a href='?d=08102006' class='links' title='Новости за 08.10.2006'>8</a></td>
    202. </tr>
    203. <tr>
    204. <td align=center ><a href='?d=09102006' class='links' title='Новости за 09.10.2006'>9</a></td>
    205. <td align=center ><a href='?d=10102006' class='links' title='Новости за 10.10.2006'>10</a></td>
    206. <td align=center ><a href='?d=11102006' class='links' title='Новости за 11.10.2006'>11</a></td>
    207. <td align=center ><a href='?d=12102006' class='links' title='Новости за 12.10.2006'>12</a></td>
    208. <td align=center ><a href='?d=13102006' class='links' title='Новости за 13.10.2006'>13</a></td>
    209. <td align=center ><a href='?d=14102006' class='links' title='Новости за 14.10.2006'>14</a></td>
    210. <td align=center ><a href='?d=15102006' class='links' title='Новости за 15.10.2006'>15</a></td>
    211. </tr>
    212. <tr>
    213. <td align=center ><a href='?d=16102006' class='links' title='Новости за 16.10.2006'>16</a></td>
    214. <td align=center ><a href='?d=17102006' class='links' title='Новости за 17.10.2006'>17</a></td>
    215. <td align=center ><a href='?d=18102006' class='links' title='Новости за 18.10.2006'>18</a></td>
    216. <td align=center ><a href='?d=19102006' class='links' title='Новости за 19.10.2006'>19</a></td>
    217. <td align=center class='calpost'><a href='?d=20102006' class='links' title='Новости за 20.10.2006'>20</a></td>
    218. <td align=center ><a href='?d=21102006' class='links' title='Новости за 21.10.2006'>21</a></td>
    219. <td align=center ><a href='?d=22102006' class='links' title='Новости за 22.10.2006'>22</a></td>
    220. </tr>
    221. <tr>
    222. <td align=center class='caltoday'><a href='?d=23102006' class='links' title='Новости за 23.10.2006'>23</a></td>
    223. <td align=center ><a href='?d=24102006' class='links' title='Новости за 24.10.2006'>24</a></td>
    224. <td align=center ><a href='?d=25102006' class='links' title='Новости за 25.10.2006'>25</a></td>
    225. <td align=center ><a href='?d=26102006' class='links' title='Новости за 26.10.2006'>26</a></td>
    226. <td align=center ><a href='?d=27102006' class='links' title='Новости за 27.10.2006'>27</a></td>
    227. <td align=center ><a href='?d=28102006' class='links' title='Новости за 28.10.2006'>28</a></td>
    228. <td align=center ><a href='?d=29102006' class='links' title='Новости за 29.10.2006'>29</a></td>
    229. </tr>
    230. <tr>
    231. <td align=center ><a href='?d=30102006' class='links' title='Новости за 30.10.2006'>30</a></td>
    232. <td align=center ><a href='?d=31102006' class='links' title='Новости за 31.10.2006'>31</a></td></tr>
    233. <tr>
    234. <td colspan="3" class="calm" style="border: 0;">&nbsp;<a href="?m=092006" class="links"><-сентябрь</a></td></tr>
    235. </table>
    236. </div>
    237.  
    238. </div>
    239. <div id="news">
    240. <div id="title"><p>Новости</p></div>
    241. <div id="messages">
    242. <div id="head">20.10.06  Антивирус Касперского 6.0 получает награду "Выбор редакции" американского издания CNET</div>
    243. <div id="text">Лаборатория Касперского» удостоилась награды ведущего американского компьютерного онлайн-портала CNET за продукт Антивирус Касперского 6.0, который, по мнению экспертов издания, устанавливает стандарт защиты потребителей от вирусов, троянских и шпионских программ, червей, руткитов и фишинга.
    244.  
    245. Престижнейшая в IT-индустрии награда CNET Editors’ Choice Award ("Выбор редакции") присуждается технологическим и потребительским продуктам, предлагающим лучшее качество, производительность, дизайн и функциональность. Кроме того, приз, присуждаемый редакцией CNET, считается индикатором выгодности инвестиций в данный продукт и рекомендацией к его приобретению.
    246.  
    247. Продукты, отмеченные «Выбором Редакции CNET», признаются лучшими в своих категориях и устанавливают планку качества, по которой оцениваются все последующие продукты. Ключевым критерием при выборе победителя является то, насколько сильно предлагаемое решение меняет жизнь своих пользователей в лучшую сторону. При этом учитываются такие факторы, как, например, инновации, соотношение цены и качества, простота использования продукта.
    248.  
    249. Антивирус Касперского 6.0 сочетает традиционные методы защиты от вирусов с новейшими технологиями проактивной защиты, которые обеспечивают не имеющую аналогов по надежности защиту от вредоносных программ. Продукт прост в установке и освоении и легко настраивается под индивидуальные потребности каждого пользователя. По словам членов жюри CNET, «Антивирус Касперского 6.0 – лучшее антивирусное приложение, которое мы видели в этом году. По результатам тестов производительности, проведенных специалистами как CNET, так и независимых организаций, антивирусные решения «Лаборатории Касперского» опережают по производительности аналогичные продукты своих всемирно известных конкурентов».
    250.  
    251. «Мы очень гордимся качеством своих продуктов и высокими стандартами, которые устанавливает наша вирусная лаборатория, - говорит Стив Оренберг, президент американского офиса «Лаборатории Касперского». – Награда CNET Editors' Choice Award является международным знаком технологического качества и инновационности, и мы очень рады признанию наших достижений в разработке лучших в мире на сегодняшний день технологий по обеспечению информационной безопасности».</div>
    252. </div>
    253. <div id="ext"><a href="#">ID</a>&nbsp;&nbsp;<a href="#">Подробнее</a></div>
    254. </div>
    255.  
    256. <div id="bottom" align="center">
    257. <div id="inner">
    258. <img src="http://www.antec.kiev.ua/image/cnopka-bel1.jpg" />
    259. <img src="http://www.antec.kiev.ua/image/cnopka-bel2.jpg" />
    260. <img src="http://www.antec.kiev.ua/image/cnopka-bel4.jpg" />
    261. <img src="http://www.antec.kiev.ua/image/cnopka-bel5.jpg" />
    262. <img src="http://www.antec.kiev.ua/image/cnopka-bel6.jpg" />
    263. </div>
    264. <div id="copyrights" align="center">АНТЕК ПРО © 2006  Developer Yurii Zakharov</div>
    265. </div>
    266. </div>
    267. </div>
    268. </body>
    269. </html>
     
  13. Yuric

    Yuric Активный пользователь

    С нами с:
    23 окт 2006
    Сообщения:
    3
    Симпатии:
    0
    Спасибо всем большое за помощь и консультацию, если честно то просветили :) Буду пробовать себя в блочной верстке
     
  14. Anonymous

    Anonymous Guest

    Yuric, лишь один совет... это не панацея, не переусердствуй... ;)