Перейти к содержимому

Сервис обмена электронных валют


Таблицы...не масштабируются

#1 Гость_ШтукаФен_*

Гость_ШтукаФен_*
  • Гости
0

Отправлено 17 Декабрь 2008 - 10:00

Дело такое, только начинаю разбираться во всем, так что сильно не пинайте :)
В общем, в Dreamweaver делаю сайт с табличным дизайном, задаю ширину и высоту в процентах, не фиксированно...НО как только меняю разрешение с 1440*900 на, например, 1280*1024 или 1024*768, появляется горизонтальный скролл...Ничего не могу понять, уже задолбался гуглить, помогите пожалуйста, а то мозг уже по швам трещит! Хотя бы ткните пальцем, где почитать, буду очень-очень благодарен!!!

 

 

  • 0

#2 Vialls

Vialls
  • Пользователь
  • 581 сообщений
  • Репутация: 1

Отправлено 17 Декабрь 2008 - 12:00

Код, в студию пожалуйста. Так, вам никто не поможет.
  • 0

#3 ZiTosS

ZiTosS
  • Пользователь
  • 5 148 сообщений
  • Репутация: 8

Отправлено 17 Декабрь 2008 - 12:24

+1, Vialls
Код в студию! Экстрасенсы в отпуске. Если сайт есть в интернете, то дайте на него прямую ссылку! Разберёмся
  • 0

#4 Гость_ШтукаФен_*

Гость_ШтукаФен_*
    Topic Starter
  • Гости

Отправлено 17 Декабрь 2008 - 13:04

www.ps66.ru
Нужен будет код - пошлю...
  • 0

#5 Vialls

Vialls
  • Пользователь
  • 581 сообщений
  • Репутация: 1

Отправлено 17 Декабрь 2008 - 13:40

Сайт не открывается у меня, давайте код...
  • 0

#6 Гость_ШтукаФен_*

Гость_ШтукаФен_*
    Topic Starter
  • Гости

Отправлено 17 Декабрь 2008 - 13:44

[codebox]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR...nsitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Главная Personal Systems</title>
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
<link href="astyle.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
.стиль2 {font-family: Arial, Helvetica, sans-serif}
.стиль4 {color: #FFFFFF}
-->
</style>
</head>
<body bgcolor="#ffffff">
<body>
<table width="100%" height="1042" border="0" bordercolor="#000000">
<tr>
<td width="18%" height="103" bordercolor="#FFFFFF"><img src="img/Logo_v5.png" width="155" height="155" align="middle" /></td>
<td width="82%" bordercolor="#FFFFFF"><div align="center">
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macr...e,img/banner_v6' ); //end AC code
</script>
<noscript>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macr...rsion=9,0,28,0" width="800" height="120" hspace="100" title="main">
<param name="movie" value="img/banner_v6.swf" />
<param name="quality" value="high" />
<embed src="img/banner_v6.swf" width="800" height="120" hspace="100" quality="high" pluginspage="http://www.adobe.com...ShockwaveFlash" type="application/x-shockwave-flash"></embed>
</object>
</noscript>
</div></td>
</tr>
<tr>
<td colspan="2" align="center" valign="middle"><img src="img/upper_line.png" width="1400" height="2" /></td>
</tr>
<tr>
<td height="844" colspan="2" align="left" valign="top" bordercolor="#FFFFFF"><table width="100%" height="846" border="0">
<tr>
<td width="12%" height="842" align="left" valign="top" bordercolor="#000000"><p>
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macr...h,movie,button1' ); //end AC code
</script>
<noscript>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macr...ersion=5,0,0,0" name="main" width="159" height="46" align="middle" id="main">
<param name="movie" value="button1.swf" />
<param name="quality" value="high" />
<embed src="button1.swf" width="159" height="46" align="middle" quality="high" pluginspage="http://www.adobe.com...ShockwaveFlash" type="application/x-shockwave-flash" name="main" ></embed>
</object>
</noscript>
</p>
<p>
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macr...h,movie,button3' ); //end AC code
</script>
<noscript>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macr...ersion=5,0,0,0" width="159" height="46" title="places">
<param name="movie" value="button3.swf" />
<param name="quality" value="high" />
<embed src="button3.swf" width="159" height="46" quality="high" pluginspage="http://www.adobe.com...ShockwaveFlash" type="application/x-shockwave-flash" ></embed>
</object>
</noscript>
</p>
<p>
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macr...h,movie,button4' ); //end AC code
</script><noscript>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macr...ersion=5,0,0,0" width="159" height="46" title="price">

<param name="movie" value="button4.swf" />
<param name="quality" value="high" />
<embed src="button4.swf" width="159" height="46" quality="high" pluginspage="http://www.adobe.com...ShockwaveFlash" type="application/x-shockwave-flash" ></embed>
</object>
</noscript>
</p>
<p>
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macr...h,movie,button5' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macr...ersion=5,0,0,0" width="159" height="46" title="post">
<param name="movie" value="button5.swf" />
<param name="quality" value="high" />
<embed src="button5.swf" width="159" height="46" quality="high" pluginspage="http://www.adobe.com...ShockwaveFlash" type="application/x-shockwave-flash" ></embed>
</object></noscript>
</p>
<p>
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macr...h,movie,button7' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macr...ersion=5,0,0,0" width="159" height="46" title="contacts">
<param name="movie" value="button7.swf" />
<param name="quality" value="high" />
<embed src="button7.swf" width="159" height="46" quality="high" pluginspage="http://www.adobe.com...ShockwaveFlash" type="application/x-shockwave-flash" ></embed>
</object>
</noscript>
</p>
<p><img src="img/pit-stop3.png" width="159" height="46" /></p></td>
<td width="88%" valign="top" bordercolor="#000000">&nbsp;</td>
</tr>
</table></td>
</tr>
<tr>
<td height="10" align="center" bordercolor="#000000" bgcolor="#0000FF"><div align="left" class="стиль2 стиль4">
<div align="left">Personal Systems © 2008 </div>
</div></td>
<td height="10" align="center" bgcolor="#0000FF"><div align="right"><a href="index1.html">Версия сайта без анимации</a></div></td>
</tr>
</table>
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-6694141-1");
pageTracker._trackPageview();
} catch(err) {}</script>
</body>
</html>[/codebox]
  • 0

#7 Vialls

Vialls
  • Пользователь
  • 581 сообщений
  • Репутация: 1

Отправлено 17 Декабрь 2008 - 14:04

Ешкин, кот.... Мне не охото разбираться в этом ужасе... Можете примерно код набросать, как вы делаете, без JavaScript'а и подобной лажи... А вообще на первый взгляд, мне кажется, дело в том, что внутри вашей таблици (которая 100%), лежит элемент(ы), который превышает размеры разрешения экрана ("1280*1024 или 1024*768") и поэтому родительская таблица расползается и создает скроллбар... Ищите...
  • 0

#8 Bender

Bender
  • Пользователь
  • 712 сообщений
  • Репутация: 0

Отправлено 17 Декабрь 2008 - 14:49

Там полоска 1 400 x 2 пикселей
  • 0

#9 ZiTosS

ZiTosS
  • Пользователь
  • 5 148 сообщений
  • Репутация: 8

Отправлено 17 Декабрь 2008 - 19:37

ШтукаФен,
Открыл ваш сайт и посмотрел исходники... Вы задумывались над словом резиновый дизайн? Как он может быть резиновым, если многие элементы страницы(картинки, Flash) заданы в абсолютном значении. Вот к примеру ваша линия:
..............
<img src="img/upper_line.png" width="1400" height="2" />
.............

Вы задали ей размер 1400px, а таблица и её ячейки у вас в процентном соотношении, но в данном случае 100% будет не размер окошка, а размер по ширине элементов вставленных в таблицу.

Поэтому ваш дизайн нельзя назвать резиновым. Для того чтобы дизайн был резиновый должны быть выполнены следующие пункты:
1) Размеры элементов, которые должны тянуться или сжиматься, нужно задавать в процентном соотношении, Размеры же элементов статичный, ограниченных по размерам нужно задавать абсолютно(Конечно это не по стандартам. В стандартах используется либо одно указание либо другое), НО абсолютное значение элементов лежащих на одной горизонтальной лини (бок о бок друг к другу) не должен привышать размеров окна. Размеры окна вы должны высчитать сами, относительно какого минимального размера вы верстаете, обычно это 800x600
2) Размеры картинок всегда абсолютны, задавать их в процентах не советую, это неправильный ход. Поэтому если хотите вставить в элемент какую либо картинку, лучше сделайте её фоном.

В вашем примере можно было сделать картинку размером 2x1 и просто закрасить ячейку таблицы подобным рисунком.
Если вы считаете что картинка одноцветна, то её можно и восе задать цветом фона, или же бордюром элемента(background-color, border)

Почитать про всё это можно на _http://htmlbook.ru/
Там много что сказано про резиновую вёрстку, а также про задание свойств и атрибутов элементу(CSS).

В вашем случае проще сделать так, ваш код
<td colspan="2" align="center" valign="middle"><img src="img/upper_line.png" width="1400" height="2" /></td>
Заменить на
<td  colspan="2" style="background-color: blue; width: 100%; height: 2px;"></td>

Задавайте вопросы и мсы вам на них ответим :)
  • 0

#10 Гость_ШтукаФен_*

Гость_ШтукаФен_*
    Topic Starter
  • Гости

Отправлено 17 Декабрь 2008 - 20:55

Спасибо огроменное! Буду разбираться, а ваш ответ - это прямо целая статья, можно было бы ее использовать как faq для начинающих. Потому что сколько ни искал, ничего подобного не нашел. Это на самом деле ошибка многих, как я понял.
  • 0

robot

robot
  • Пользователь PRO
  • 2 652 сообщений
  • Репутация: 85


Оформление форума – IPBSkins.ru