1. Задавайте здесь вопросы о коде, которые не подходят в другие разделы, такие как:
    Дизайн > Верстка
    PHP > Как сделать на PHP
    Скрыть объявление

Требуется помощь по HTML

Тема в разделе "Web Coding", создана пользователем salo2007, 29 дек 2007.

Статус темы:
Закрыта.
Модераторы: latteo
  1. salo2007

    salo2007 Постоялец

    Регистр.:
    17 ноя 2007
    Сообщения:
    64
    Симпатии:
    10
    Всем привт вопрос вот такой... Вчера вечером сел писать шаблон для форума DLE... проблема нарисовалася прямо сразу.... сразу говорю.... я в HTML и CSS делетант... тока учу)

    Собственно вот код таблицы.... все ее ячейки с рисунками... между рисунками по вертикали пробелов нет а между рисунками в первой и второй строке есть пробел.... скока я ни мучался.. ниче не помогает.... половину мануалов инета перерыл.. все бесполезно.... мож кто знает как это подправить? Извращался как тока мог.. не помогает....

    Код:
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="100px" height="30px" class="topic_verx_left"/></td>
        <td widtn="99%" div class="topic_verx_seredina" /></td>
        <td width="100px" height="30px" class="topic_verx_right" /></td>
      </tr>
      <tr>
            <td colspan="3" width="100px" height="30px" class="topic_verx"/>
      </tr>
         </table>
    Вот собственно CSS

    Код:
    .topic_verx_left{
    background-image: url('{THEME}/forum/images/left_bl.gif');
    background-repeat: no-repeat;
    position: relative;
    top: 10px;
    width: 100px;
    height: 30px;
    }
    
    .topic_verx_seredina{
    background-image: url('{THEME}/forum/images/fon_verx.gif');
    background-repeat: repeat-x;
    }
    
    .topic_verx_right{
    background-image: url('{THEME}/forum/images/right_bl.gif');
    background-repeat: no-repeat;
    position: relative;
    top: 10px;
    width: 100px;
    height: 30px;
    }
    
    .topic_verx{
    background-image: url('{THEME}/forum/images/fon_pod_verx.gif');
    background-repeat: repeat-x;
    }

    И вообще... кто нить напишите по подробнее обо всем этом.. имею ввиду как совместить рисунки без пробелов...
     
  2. Dark Wizard

    Dark Wizard

    Регистр.:
    23 сен 2007
    Сообщения:
    157
    Симпатии:
    76
    Ну, во-первых последний <td> не закрыт,

    во вторых лучше писать не widtn="99%" а width="*", потому что у тебя таблица на весь экран растянута, а боковые колонки фиксированного размера

    Попробуй так
     
  3. salo2007

    salo2007 Постоялец

    Регистр.:
    17 ноя 2007
    Сообщения:
    64
    Симпатии:
    10
    Непомогает...... как было так и есть.... между горизонтальными строками все таже белая линия....
     
  4. mail4var

    mail4var Создатель

    Регистр.:
    14 авг 2006
    Сообщения:
    28
    Симпатии:
    1
    Неправильный html

    Уважаемый, будь внимательным при написании html.

    Он у тя неправильно написан

    смотри красные пометки,

    1. зачем ты закрываешь тег td
    <td width="100px" height="30px" class="topic_verx_right" /></td>

    2. откуда в теге td взялся div
    <td widtn="99%" div class="topic_verx_seredina" /></td>

    3. подправь это все и выложи с картинками которые в ксс или дай урл в инете чтоб мона было сразу посмотреть

    А вообще юзай мозилу с плагином firebug - для того чтобы инспектить эелементы, поищи в инете какие нить видео уроки по нему
    и web developer - чтоб мона было просто и быстро провалидировать твой html, css на наличие ошибок
     
  5. salo2007

    salo2007 Постоялец

    Регистр.:
    17 ноя 2007
    Сообщения:
    64
    Симпатии:
    10
    Сделал как ты сказал, результат остался нулевым... можеть быть, что бы убрать этот пробел между горизонтальными строчками, нуна в таблицу какой нить параметр добавить?
     
  6. rex1963

    rex1963

    Регистр.:
    19 фев 2007
    Сообщения:
    228
    Симпатии:
    47
    <Td valign=top> - выравнивание по верхнему краю, или в стилях margin:0px padding: 0px
     
  7. mail4var

    mail4var Создатель

    Регистр.:
    14 авг 2006
    Сообщения:
    28
    Симпатии:
    1
    Сделай скриншот чтоб мы точно могли увидеть в чем проблема... В каком броузере ты смотришь, пробывал ли другие?
    Тогда будет проще те ответит.. А так пальцем в небо :)....
     
  8. mentanos

    mentanos Постоялец

    Регистр.:
    27 дек 2007
    Сообщения:
    128
    Симпатии:
    35
    Пробуй так (td{border: 1px solid red;} добавил специально, чтобы было видно ячейки таблицы)

    Код:
    .topic_verx_left{
    background-image: url('{THEME}/forum/images/left_bl.gif');
    background-repeat: no-repeat;
    width: 100px;
    height: 30px;
    }
    
    .topic_verx_seredina{
    background-image: url('{THEME}/forum/images/fon_verx.gif');
    background-repeat: repeat-x;
    }
    
    .topic_verx_right{
    background-image: url('{THEME}/forum/images/right_bl.gif');
    background-repeat: no-repeat;
    width: 100px;
    height: 30px;
    }
    
    .topic_verx{
    background-image: url('{THEME}/forum/images/fon_pod_verx.gif');
    background-repeat: repeat-x;
    }
    td{
    border: 1px solid red;
    }

    Код:
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="100" height="30" class="topic_verx_left">&nbsp;</td>
        <td class="topic_verx_seredina">&nbsp;</td>
        <td width="100" height="30" class="topic_verx_right">&nbsp;</td>
      </tr>
      <tr>
            <td colspan="3" width="100" height="30" class="topic_verx">&nbsp;</td>
      </tr>
         </table>
    Склейка порезанной картинки таблицей без просветов выполняется просто:
    1. у таблицы должны быть cellpadding=0 и cellspacing=0
    2. если ложишь картинку внутрь <td></td>, у ячейки должно быть css padding=0 (по умолчанию 0) и внутри ячейки не должно быть ничего кроме картинки, т.е. <td...><img...></td>
    3. обязательно указывай width и height для td и img там, где это возможно (т.е. для нерезиновых ячеек).
     
  9. ksido

    ksido Создатель

    Регистр.:
    8 авг 2007
    Сообщения:
    28
    Симпатии:
    5
    значение width="*" используется во фреймах, а не в таблицах. Некоторые браузеры, увидев такую запись в таблице просто ее проигнарируют, но некоторые (особо датошные) могут и всякую бяку вывести!

    mentanos все верно в таблице исправил:

    <table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td width="100" height="30" class="topic_verx_left">&nbsp;</td>
    <td class="topic_verx_seredina">&nbsp;</td>
    <td width="100" height="30" class="topic_verx_right">&nbsp;</td>
    </tr>
    <tr>
    <td colspan="3" width="100" height="30" class="topic_verx">&nbsp;</td>
    </tr>
    </table>



    Еще одна ошибка автора темы, которую еще не подметили, была в том, что он писал width="100px", хотя по синтаксису HTML должно быть width="100" а в CSS width: 100px; Видимо просто перепутал!

    И, на сколько я могу судить, после исправлений mentanos все должно правильно работать!!!
     
Статус темы:
Закрыта.