Модераторы: Illuminaty
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> таблица залезает на соседнюю ячейку 
:(
    Опции темы
supervladislav
Дата 22.5.2009, 10:50 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


///\\\///\\\///\\\
***


Профиль
Группа: Завсегдатай
Сообщений: 1771
Регистрация: 18.5.2006

Репутация: нет
Всего: -9



помогите пожалуйста есть таблица- меню ,находящаяся в ячейке другой таблицы с width 70%
rпри разрешении с 1600 ну где-то до 1200 отображается нормально ,а при ниже разрешением меню по краям начинает обрезаться а не растягиваться под ширину сайта
 ,никогда с таким не сталкивался ,подскажите как ниже следующий код сделать ризиновым и не наезжающим на соседние ячейки

Код

<td   align="left" width="80%">
<br><br>
<table cellpadding="0" cellspacing="0" align="center" border="0" width="80%" >  
 <tr valign="top">
 <td id="menprverh">&nbsp;&nbsp;&nbsp;</td><td id="menseredverh" >&nbsp;&nbsp;&nbsp;</td><td id="menlvverh" >&nbsp;&nbsp;&nbsp;</td>
 
 </tr>
 
 <tr valign="top">
 <td id="menseredpravo">&nbsp;</td><td id="menseredlevo"> 
  </td>
 
 </tr>
 
 <tr>
 <td id="mennizpr"></td><td id="menseredniz"></td><td id="menlevonizsered"></td>
 
 </tr>
 
</table> 


Код

body{
background-color:#d3f1fa;
font-family:Arial, Helvetica, sans-serif;
color:#4f9db4;
margin:0px;
padding:0px;
}
#verhmen{background-image:url(../img/pravomain.png);background-repeat:no-repeat;width:76px;height:102px;}
#verhseredina{background-image:url(../img/seredinaverh.png);background-repeat:repeat-x;height:101px;;width:90%; }
#verhlevo{background-image:url(../img/levomain.png);background-repeat:no-repeat;height:101px;width:99px;  }

#menprverh{background-image:url(../images/file_03.png);background-repeat:no-repeat;width:72px;height:40px; }
#menseredverh{background-image:url(../images/file_05.png);background-repeat:repeat-x; height:40px;width:auto; }
#menlvverh{background-image:url(../images/file_07.png);background-repeat:no-repeat;width:54px; height:40px;}

#menseredpravo{background-image:url(../images/file_27.png);background-repeat:repeat-y;width:72px;height:600px; }
#menseredlevo{background-image:url(../images/file_11.png);background-repeat:repeat;width:17px;height:13px; }
#menseredlevo1{background-image:url(../images/file_19.png);background-repeat:repeat-y;position:0% 0%;width:54px;height:600px; }

#mennizpr{background-image:url(../images/file_29.png);background-repeat:no-repeat;width:72px;height:58px;}
#menseredniz{background-image:url(../images/file_30.png);background-repeat:repeat-x;height:58px;width:auto;}
#menlevonizsered{background-image:url(../images/file_32.png);background-repeat:no-repeat;width:54px;height:58px;}







Это сообщение отредактировал(а) supervladislav - 22.5.2009, 12:13
PM MAIL   Вверх
bazzjr
Дата 22.5.2009, 16:24 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 460
Регистрация: 27.12.2007
Где: Россия, Пермь

Репутация: 2
Всего: 6



очень нехорошо давать код, который

1. вырезан хз как и хз из чего
2. давай код стилей с картинками, в надежде что кто либо будет создавать у себя эти картинки и пытаться понять, где же все таки косяк.

Вообщем товарищи, постарайтесь подойти к вопросу грамотно и логично, не заставляйте других биться головой ап стену в поисках догадок "Что же там у него за код, и хде апшибка".

Выложи плз rar архив в картинками, и более менее полным кодом страницы, в другом случае плавать в догадках нет желания...

Это сообщение отредактировал(а) bazzjr - 22.5.2009, 16:28
PM MAIL ICQ   Вверх
supervladislav
Дата 22.5.2009, 20:33 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


///\\\///\\\///\\\
***


Профиль
Группа: Завсегдатай
Сообщений: 1771
Регистрация: 18.5.2006

Репутация: нет
Всего: -9



минутку

Присоединённый файл ( Кол-во скачиваний: 2 )
Присоединённый файл  _________.zip 529,98 Kb
PM MAIL   Вверх
bazzjr
Дата 23.5.2009, 03:07 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 460
Регистрация: 27.12.2007
Где: Россия, Пермь

Репутация: 2
Всего: 6



supervladislav Это другой разговор  smile 

Я бы очень рекомендовал тебе почитать про стили (CSS) и их свойства. Например можно обойтись вот этим
background:url(../img/pravomain.png) no-repeat 0px 1px; 
     вместо того чтобы писть 
background:url(../img/pravomain.png);
background-position: 0px 1px;
background-repeat:no-repeat;    и т.д.

В твоем случае, лучше всего в те места где нужно держать строго определенную ширину, вставить прозрачный пиксель GIF (картинку 1рх) с нужной шириной и высотой в 1рх. То что я и сделал. У тебя вместо картинки стояли пробелы &nbsp; этого делать никогда не надо.

И еще рекомендация... В стилях(да и везде, даже в названиях функций), пиши лучше так men_levo_niz_sered вместо menlevonizsered, согласись так лучше и понятней читается... да тебе и самому легче разбираться будет.  smile 

Ниже исправленные код HTML и CSS:

Код

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" >
<title>Оцифровка и востановление записей в санкт-петербурге</title>
<link rel="stylesheet" type="text/css" href="css/main2.css" >
<script language="javascript" type="text/javascript">
function loadfile(){

var x = screen;
var ScreenWidht = x.width;
document.getElementById('main').style.width = ScreenWidht-5+ "px";

}
</script>
</head>
<body on1Load="loadfile();">
<div style="width:100%;" id="main">
  <table cellpadding="0" cellspacing="0" align="center" border="1" width="100%">
    <tr>
      <td colspan="2"></td>
    </tr>
    <tr>
      <td colspan="2"><table cellpadding="0" cellspacing="0" align="center" border="0" width="100%" >
          <tr>
            <td id="verhmen"><img src="img/space.gif" width="75" height="1"></td>
            <td id="verhseredina"></td>
            <td id="verhlevo"><img src="img/space.gif" width="74" height="1"></td>
          </tr>
        </table></td>
    </tr>
    <tr valign="top">
      <td   align="left" width="80%"><br>
        <br>
        <table cellpadding="0" cellspacing="0" align="center" border="0" width="80%" >
          <tr valign="top">
            <td id="menprverh"><img src="img/space.gif" width="54" height="1"></td>
            <td id="menseredverh"></td>
            <td id="menlvverh"><img src="img/space.gif" width="54" height="1"></td>
          </tr>
          <tr valign="top">
            <td id="menseredpravo"></td>
            <td id="menseredlevo"><div style="text-align:justify;font-size:15px;font-family:Arial, Helvetica, sans-serif;">fdgsdfdsfsdfdsfsdfsdfsdfggfsrgdfgdfgdfgdfgdfgdfgdfgdfgdfgdfgdfgdfgdfgdfgdfg
                gdfgdfgdfgdfgdfgdfgdfgdfgdfgdfgdfgdfgdfgdfgdfgdfgdffgdfgdfgdfgdfgdfgdfgdfgdfgdffgdfgdfgdfgdfgdfgdfgdfgdfgdffgdfgdfgdfgdfgdfgdfgdfgdfgdf</div></td>
            <td id="menseredlevo1"></td>
          </tr>
          <tr>
            <td id="mennizpr"></td>
            <td id="menseredniz"></td>
            <td id="menlevonizsered"></td>
          </tr>
        </table></td>
      <td   align="center"><br>
        <br >
        <a href="/index.html"><img src="img/main.png" width="150px" height="23px" border="0"/></a><br>
        <a href=""><img src="img/obor.png" width="150px" height="23px" border="0"/></a><br>
        <a href=""><img src="img/uslugi.png" width="150px" height="23px" border="0"/></a><br>
        <a href=""><img src="img/zakaz.png" width="150px" height="23px" border="0"/></a> <br>
        <a href=""><img src="img/vopros.png" width="150px" height="23px" border="0"/></a></td>
    </tr>
  </table>
</div>
</body>
</html>



Код

body{
background-color___:#d3f1fa;
font-family:Arial, Helvetica, sans-serif;
color:#4f9db4;
margin:0px;
padding:0px;
}
#verhmen{background:url(../img/pravomain.png) no-repeat 0px 1px; width:76px; height:101px;}
#verhseredina{background:url(../img/seredinaverh.png) repeat-x; width:100%; height:101px; }
#verhlevo{background:url(../img/levomain.png) no-repeat right top; width:76px; height:101px; }

#menprverh{background:url(../images/file_03.png) no-repeat; width:72px; height:40px; }
#menseredverh{background:url(../images/file_05.png) repeat-x; height:40px; }
#menlvverh{background:url(../images/file_07.png) no-repeat; width:54px; height:40px;}

#menseredpravo{background:url(../images/file_27.png) repeat-y; width:72px; height:600px; }
#menseredlevo{background:url(../images/file_11.png); width:100%; height:13px; }
#menseredlevo1{background:url(../images/file_19.png) repeat-y 0 0; width:54px; height:600px; }

#mennizpr{background:url(../images/file_29.png) no-repeat; width:72px; height:58px;}
#menseredniz{background:url(../images/file_30.png) repeat-x; height:58px;}
#menlevonizsered{background:url(../images/file_32.png) no-repeat; width:54px; height:58px;}


Кстати для чего ява функция loadfile()?  smile 
Она не робит в должной степени, при этом в разных браузерах ведет себя по разному...

Это сообщение отредактировал(а) bazzjr - 23.5.2009, 03:20

Присоединённый файл ( Кол-во скачиваний: 4 )
Присоединённый файл  space.gif 0,04 Kb
PM MAIL ICQ   Вверх
supervladislav
Дата 23.5.2009, 19:23 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


///\\\///\\\///\\\
***


Профиль
Группа: Завсегдатай
Сообщений: 1771
Регистрация: 18.5.2006

Репутация: нет
Всего: -9



bazzjr,а в чём раздница?

Добавлено через 5 минут и 27 секунд
а чего тебе функция Loadfile() тебе не нравится

Добавлено через 13 минут и 40 секунд
извените ещё раз а зачем вот это самая картинка почему нельзя обойтись пробелами
PM MAIL   Вверх
bazzjr
Дата 24.5.2009, 01:03 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 460
Регистрация: 27.12.2007
Где: Россия, Пермь

Репутация: 2
Всего: 6



supervladislav позволь задать тебе пару впросов...

С какого ты города?
Сколько тебе лет?
Ты умеешь мыслить логически? сможешь решить эту загадку? загадка

Зачем интересуюсь? просто ты задаешь странные вопросы, и делаешь ужасные ошибки (извЕните).

Добавлено @ 01:08
Насчет функции... Я ЖЕ НАПИСАЛ УЖЕ, ОНА НЕ РАБОТАЕТ, и ВЕДЕТ СЕБЯ ПО РАЗНОМУ В РАЗНЫХ БРАУЗЕРАХ! Выкинь ее, она не нужна....

Это сообщение отредактировал(а) bazzjr - 24.5.2009, 01:11
PM MAIL ICQ   Вверх
supervladislav
Дата 24.5.2009, 06:35 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


///\\\///\\\///\\\
***


Профиль
Группа: Завсегдатай
Сообщений: 1771
Регистрация: 18.5.2006

Репутация: нет
Всего: -9



Ну а если использовать ссылку на размеры тега боди всёравно )))
Логически еслиб не мыслил не работал программистом, ая тебя спросил в чём раздница кода моего css и твоего
разве там не используютсся  полностью одинаковые  свойства и в твоём и в моём
Добавлено @ 06:37
да и почему у тебя width 100% только в двух местах а не в трёх

Добавлено через 4 минуты и 24 секунды
спасибо 

Это сообщение отредактировал(а) supervladislav - 24.5.2009, 06:38
PM MAIL   Вверх
bazzjr
Дата 24.5.2009, 11:45 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 460
Регистрация: 27.12.2007
Где: Россия, Пермь

Репутация: 2
Всего: 6



Цитата(supervladislav @  24.5.2009,  06:35 Найти цитируемый пост)
в чём раздница кода моего css и твоего


Разница очень мала, я вместо width:75px, использую <img width="75">. Тебе обяснил уже, что в твоем случае так будет лучше всего, так как у тебя левый и правый столбцы ширина в пикселях, а середина в процентах, лтсюда у тебя и нарушаеться отображение столбцов по краям. Если же мы ставим картинку(прозрачный пиксель), то нарушить эту ширину уже никак нельзя.


Цитата(supervladislav @  24.5.2009,  06:35 Найти цитируемый пост)
да и почему у тебя width 100% только в двух местах а не в трёх


третья 80%, было у тебя в коде, я так понимаю для красоты, чтобы по краям был отступ у контента.
PM MAIL ICQ   Вверх
supervladislav
Дата 24.5.2009, 20:10 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


///\\\///\\\///\\\
***


Профиль
Группа: Завсегдатай
Сообщений: 1771
Регистрация: 18.5.2006

Репутация: нет
Всего: -9



а скажи почему ячейку нельзя завиксировать по ширине width;75px;

я имел ввиду в чём раздница между 
background:url(../img/pravomain.png) no-repeat 0px 1px; 
     вместо того чтобы писть 
background:url(../img/pravomain.png);
background-position: 0px 1px;
background-repeat:no-repeat; 
и 

вот этим 
#verhmen{background:url(../img/pravomain.png) no-repeat 0px 1px; width:76px; height:101px;}
#verhseredina{background:url(../img/seredinaverh.png) repeat-x; width:100%; height:101px; }
#verhlevo{background:url(../img/levomain.png) no-repeat right top; width:76px; height:101px; }
PM MAIL   Вверх
bazzjr
Дата 24.5.2009, 22:41 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 460
Регистрация: 27.12.2007
Где: Россия, Пермь

Репутация: 2
Всего: 6



Цитата(supervladislav @  24.5.2009,  20:10 Найти цитируемый пост)
а скажи почему ячейку нельзя завиксировать по ширине width;75px;


Понимаешь, когда ты указываешь в таблице одному из столбцов процентную ширину (%), а другим пиксельную(рх), то приоритет отдается процентам, и поэтому в некоторых случаях, процентные столбцы "наезжают" на пиксельные. 


Цитата(supervladislav @  24.5.2009,  20:10 Найти цитируемый пост)
я имел ввиду в чём раздница между 


Разница только в наглядности и краткости записи.
PM MAIL ICQ   Вверх
supervladislav
Дата 25.5.2009, 01:28 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


///\\\///\\\///\\\
***


Профиль
Группа: Завсегдатай
Сообщений: 1771
Регистрация: 18.5.2006

Репутация: нет
Всего: -9



а что если style="width:31px;"
как вот тут www.massage-ceragem.ru
работает ведь 
кстате а можно использовать 
padding-right:30p[;

PM MAIL   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »


 




[ Время генерации скрипта: 0.0853 ]   [ Использовано запросов: 21 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.