Вопросы от Кузьмича. Архив.
|
|
[16] likbezz [18.02.2012, 03:10] |
рыбак, Quote (рыбак) Так в padding-right: 25px вся соль же Ёпт. Вся соль не отступе, а в неверно указанном размере для второй ячейки. ...
Code (width="233") + (width="687" + padding-right: 25px;) ≠ width="920"
Эта формула отвечает на вопрос почему косяк, а не как его убрать. А убрать - можно кучей способов. Один из них - удалить фиксированный размер второй ячейки и установить ей ширину auto. Что было и сделано в коде: Code <tr><td height="38" id="data" style="width:233px;padding:0;">$WDAY$, $DATE$, $TIME$</td><td height="38" style="width:auto;" id="bar">бар</td></tr> вместо: Code <tr><td height="38" width="233" id="data">$WDAY$, $DATE$, $TIME$</td><td height="38" width="687" id="bar">бар</td></tr> и после этого:
Code (width="233") + (width="auto" + padding-right: 25px;) = width="920" ...
Quote (рыбак) Просто слово бар и id="bar" не нужно путать в моих постах В див я обвёл именно слово бар Где это я напутал? У меня код перед глазами и я вижу где находится слово «бар». ... |
|
[17] рыбак [18.02.2012, 03:36] |
Просто я не понимаю почему фиксированная ширина не работает , ведь padding то это позционирование внутри ячейки, а не снаружи
Quote (likbezz) Где это я напутал? а почему тогда способ которым я сделал - не верен? |
|
[18] likbezz [18.02.2012, 06:10] |
Quote (рыбак) Просто я не понимаю почему фиксированная ширина не работает , ведь padding то это позционирование внутри ячейки, а не снаружи Box model ...
Quote (рыбак) а почему тогда способ которым я сделал - не верен? А кто сказал, что не верен? Он не логичен, а не “не верен”. ... |
|
[19] рыбак [18.02.2012, 13:59] |
На этот абзац обратить внисание?: Quote Соответственно тот же пример «ширина элемента 100px и внутренний отступ по 10px с каждой стороны» уже даст блок с общей шириной 120px! Так как width:100px означает именно 100px под контентную зону. Все отступы и границы добавляются к этому фиксированному значению. Тоесть с width="auto" логичней и все браузеры это "понимают"? |
|
[20] likbezz [18.02.2012, 18:27] |
рыбак, Quote (рыбак) Тоесть с width="auto" логичней и все браузеры это "понимают"? В данном случае, да, логичнее. Да, все понимают. ... |
|
[21] рыбак [19.02.2012, 04:13] |
likbezz, посмотрел код http://likbezz.ru, свёрстано вроде не сложно. Это при желании можно любой стандартный дизайн переверстать в див, поднять контент выше меню без перерисовки картинок или я размечтался и приём с float:right; и float:left; не так универсален и прост? |
|
[22] likbezz [19.02.2012, 08:09] |
рыбак, Quote (рыбак) посмотрел код http://likbezz.ru, свёрстано вроде не сложно. Это при желании можно любой стандартный дизайн переверстать в див, поднять контент выше меню без перерисовки картинок Смотря каких картинок. Никто и не говорил, что это супер-сложно ... Просто этим заниматься нужно ) ... Quote (рыбак) не так универсален и прост? Есть некоторые проблемы, опять же, основная заморочка - с размерами, в ИЕ < 8 версии. ... |
|
[23] рыбак [19.02.2012, 13:13] |
Quote (likbezz) Смотря каких картинок. Вон страничку выше давал. Хочется ячейки в третьей строчке местами поменять, а остальное в принципе незачем в дивы. Опасение вызывает только то, получится ли подогнать без швов картинки. Очень важна кроссбраузерность, включая ИЕ >8 |
|
[24] likbezz [19.02.2012, 13:41] |
рыбак, Quote (рыбак) включая ИЕ >8 В смысле < 8 ) потому как в > 8 проблем, обычно, не возникает ... ... Quote (рыбак) Опасение вызывает только то, получится ли подогнать без швов картинки А почему должны быть швы? - проставляй верные размеры и швов не будет. .. |
|
[25] рыбак [19.02.2012, 13:52] |
Quote (likbezz) В смысле < 8 ) да Quote (likbezz) А почему должны быть швы? ну в смысле сойдутся картинки как надо или нет. Сейчас пробую, вроде сходится... |
|
[26] likbezz [19.02.2012, 15:27] |
рыбак, Quote (рыбак) ну в смысле сойдутся картинки как надо или нет Пока не попробуешь - не узнаешь ) |
|
[27] рыбак [19.02.2012, 17:38] |
Из кода на прошлой страничке видно что структура сайта такая(без лишнего): Quote <div align="center"> <table cellpadding="0" cellspacing="0" border="0" width="920" align="center"> <tbody> <tr><td height="38" width="233" id="data">Дата</td><td height="38" width="687" id="bar">Бар</td></tr> <tr><td height="165" width="920" colspan="2" id="header">Кусок шапки</td></tr> <tr><td valign="top" width="233"style="background:url('http://ucoz.ru/.s/t/956/1.gif') repeat-y #D9DC82;">Сайдбар</td> <td width="687" valign="top" style="background:url('http://ucoz.ru/.s/t/956/2.gif') repeat-y #FFFFFF;">Контент</td></tr> </tbody> </table>
Я оставляю одну ячейку, заменяю ячейки дивами, меняю местами дивы, которым задаю float: Quote <div align="center"> <table cellpadding="0" cellspacing="0" border="0" width="920" align="center"> <tbody> <tr><td height="38" width="233" id="data">Дата</td><td height="38" width="687" id="bar">Бар</td></tr> <tr><td height="165" width="920" colspan="2" id="header">Кусок шапки</td></tr> <tr><td colspan="2"><div slyle="width:687px;float:right;background:url('http://ucoz.ru/.s/t/956/2.gif') repeat-y #FFFFFF;">Контент</div><div slyle="float:left;width:233px;background:url('http://ucoz.ru/.s/t/956/1.gif') repeat-y #D9DC82;">Сайдбар</div></td></tr> </tbody> </table>
И что удивительно...работает, картинки сходятся! даже в ИЕ 7(не точно) Какие ещё стили нужно задать блокам для надёжности? clear? block? overflow? Не знаю...
Доктайп если нужно, задан переходный: Code <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> |
|
[28] likbezz [19.02.2012, 21:20] |
рыбак, Quote (рыбак) Доктайп если нужно, задан переходный: Нормально. ...
Quote (рыбак) Какие ещё стили нужно задать блокам для надёжности? Вот сюда впихни вот это (на всякий случай ヅ): Quote (Code) Сайдбар</div><br class="clear" /></td> и в CSS вот это: Code .clear{clear:both;display:block;float:none;font:0/0 a;height:0;overflow:hidden;} ... |
|
[29] рыбак [19.02.2012, 23:15] |
А так, в общем, ошибок в коде нет? ...
И ещё вопрос: как сделать чтобы дивы были растянуты до самого футера(как и было в ячейках), а то один до футера, а другой как "обрубок" ? ...
У ячеек было задано valign="top", может стоит и дивам сделать display: table-cell; и vertical-align: top; Или это лишнее и картинки и так никуда не сдвинутся? ...Добавлено (19.02.2012, 23:02) --------------------------------------------- overflow:hidden; ведь нужен для блоков Quote чтобы избежать разрывов содержимого и падения колонок
Или ячейка и так хорошо держит блоки ЗЫ я не гонюсь за весом кода, мне главное кроссбраузерностьДобавлено (19.02.2012, 23:15) --------------------------------------------- Уууууухты, что я увидел Code <div class="sphome"> <h1>Вопросы от Кузьмича)). (Страница: 8)</h1><h2>Если вы пришли за помощью, то Вам сюда...</h2><h3>Кому требуется помощь в вёрстке сайта... и не только... </h3> </div> |
|
[30] likbezz [19.02.2012, 23:18] |
рыбак, Quote (рыбак) А так, в общем, ошибок в коде нет? Когда будут - ты первый заметишь ) ...
Quote (рыбак) И ещё вопрос: как сделать чтобы дивы были растянуты до самого футера(как и было в ячейках), а то один до футера, а другой как "обрубок" ? А вот тут ... самое хреновое. Нужно делать внешнюю обёртку с фоном для каждой такой ячейки ... ...
Quote (рыбак) У ячеек было задано valign="top", может стоит и дивам сделать display: table-cell; и vertical-align: top; Или это лишнее и картинки и так никуда не сдвинутся? Давно бы уже попробовал ) Нет, ни куда не сдвинуться. ...
Quote (рыбак) overflow:hidden; ведь нужен для блоков ? Ну проставь - лишним не будет, если что - скроется. Работает только с блоками у которых указаны размеры. ... |
|