Jump to content

trogvar

Newbie
  • Posts

    3
  • Joined

  • Last visited

trogvar's Achievements

Explorer

Explorer (1/14)

0

Reputation

  1. sertu, спасибо. Если поможете, будет здорово. Строгий док тайп поставить не получится. Этот макет я для темы cms делаю, а сторонние модули Drupal свои стили используют, которые не всегда валидные. Лучше оставить переходный тип. P.S.аськой не пользуюсь
  2. Veseloff, а с багом в Опере (однопиксельная горизонтальная полоска у вложенных таблиц) можете подсказать что-нибудь?
  3. Доброго дня! Вопрос к гуру валидной вёрстки: можно ли и нужно ли такой макет переверстать только слоями? Сейчас вариант очень простой, работает везде и валидный. Но всё построено на таблицах. Только один маааленький баг - в Опере появляется однопиксельная серая полоска вдоль границы вложенных таблиц.... <!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> <title>Grail</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" /> <link rel="stylesheet" type="text/css" href="css.css" /> </head> <body> <table cellpadding="0" cellspacing="0" class="h"> <tr> <td class="h1"></td> <td class="h2"></td> <td class="h3"></td> </tr> </table> <table cellpadding="0" cellspacing="0" class="search"> <tr> <td>ссылка 1 | ссылка 2</td> <td class="r">ссылка 3</td> </tr> </table> <table cellpadding="0" cellspacing="0" class="all-cl"> <tr> <td class="cl1"><div class="b"> <div class="b-h"></div> <h2>Заголовок</h2> <p>текст</p> <div class="b-f"></div> </div> <div class="b"> <div class="b-h"></div> <h2>Заголовок</h2> <p>текст</p> <div class="b-f"></div> </div></td> <td class="cl2"><div class="loon1"> <div class="loon2"> <table cellpadding="0" cellspacing="0" class="ln1"> <tr> <td><img src="c.jpg" alt="" /></td> <td style="text-align:right"><img src="c.jpg" alt="" /></td> </tr> </table> <div class="loon3"> <h1>Заголовок 1</h1> <h3>Заголовок 3</h3> <h4>Заголовок 4</h4> <p>текст</p> </div> <table cellpadding="0" cellspacing="0" class="ln2"> <tr> <td><img src="c.jpg" alt="" /></td> <td style="text-align:right"><img src="c.jpg" alt="" /></td> </tr> </table> </div> </div></td> <td class="cl3"><div class="b"> <div class="b-h"></div> <h2>Заголовок</h2> <p>текст</p> <div class="b-f"></div> </div></td> </tr> </table> <table cellpadding="0" cellspacing="0" class="f"> <tr> <td>ссылка 4</td> <td class="r">ссылка 5</td> </tr> </table> </body> </html> @charset "utf-8"; * {font-size:100%; margin:0;} BODY {margin:0px; padding:0px; background:#363 repeat left bottom;} BODY, TABLE, TH, TD, UL, OL, LI {padding:0; border-collapse:collapse; list-style:none; vertical-align:top} IMG {border:0} /* ================ DESIGN ================ */ .clear-all {clear:both} .h {width:100%; background:#060; background:url(b-texture.gif);} .h1 {background:url(i1.jpg) no-repeat left top; width:300px; height:110px;} .h2 {background:url(i2.jpg) no-repeat center top; width:300px; height:110px;} .h3 {background:url(i3.jpg) no-repeat right top; width:300px; height:110px;} .all-cl {width:100%} .ln1 {width:100%; background:url(c.jpg) repeat-x} .ln2 {width:100%; background:url(c.jpg) repeat-x} .loon1 {background:url(b2.jpg) #960 repeat-y 0% 0%; vertical-align:top;} .loon2 {background:url(b2.jpg) repeat-y 100% 0%; vertical-align:top;} .loon3 {padding:0 15px;} .cl1 {background:url(b1.jpg) #33C repeat-y 0% 0%; width:190px; padding:0 15px; vertical-align:top;} .cl2 {background:#363; padding:0; vertical-align:top; background:url(b-texture.gif) bottom left;} .cl3 {background:url(b1.jpg) #999 repeat-y 100% 0%; width:190px; padding:0 15px; vertical-align:top;} .search, .f {width:100%; background-color:#FC0;/*background:url(b2.jpg);*/} .search TD, .f TD {width:50%; vertical-align:top;} .r {text-align:right;} /* ================ BLOCKS ================ */ .b {padding:0; margin:10px 0; background:url(b-b.jpg) repeat-y;} .b H2, .b P {padding:0 10px;} .b-h {background:url(b-h.gif) top left; width:190px; height:10px;} .b-f {background:url(b-f.gif) bottom left; width:190px; height:10px;} /* ================ TEXT ================ */ P {padding:5px 0;} H1 {font-size:220%;} H2 {font-size:200%;} H3 {font-size:180%;} H4 {font-size:150%;} a:link {color:#F60} Заранее спасибо!
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy