Проблема с таблицами

Stan-86 · April 11, 2012

День добрый.С версткой работаю совсем недавно,поэтому надеюсь на ваше понимание.Сайт делался в программе SiteEdit Business.

Вот собственно сам сайт - www.lidisha.ru

Вопросы:

1.Неправильное отображение таблиц-все кривое

2.На этой странице http://lidisha.ru/futbolkimaiki.html раньше были овальные рамки-сейчас как-то съехало все(как исправить не знаю-уже месяц бьюсь)

как понимаю икать где-то здесь

#td52 {

background-image : url(ugol_verh_left.jpg);

background-repeat : no-repeat;

height : 9px;

}

#td54 {

background-image : url(ugol_verh_right.jpg);

background-repeat : no-repeat;

}

#td56 {

background-image : url(liniya_left.jpg);

background-repeat : repeat-y;

}

#td58 {

background-image : url(liniya_right.jpg);

background-repeat : repeat-y;

}

#td60 {

background-image : url(ugol_niz_left.jpg);

background-repeat : no-repeat;

}

#td62 {

background-image : url(ugol_niz_right.jpg);

background-repeat : no-repeat;

}

#td61 {

background-image : url(liniya_niz.jpg);

background-repeat : repeat-x;

}

#td53 {

background-image : url(liniya_verh.jpg);

background-repeat : repeat-x;

font-size : 0;

height : 9px;

}

#table94 {

background-image : url(panel_kompas.jpg);

background-repeat : no-repeat;

margin-top : 10px;

}

#table97 {

background-image : url(panel_globus.jpg);

background-repeat : no-repeat;

margin-top : 15px;

}

#td117 {

background-image : url(ugol_verh_left.jpg);

background-repeat : no-repeat;

height : 9px;

}

#td119 {

background-image : url(ugol_verh_right.jpg);

background-repeat : no-repeat;

}

#td121 {

background-image : url(liniya_left.jpg);

background-repeat : repeat-y;

}

#td123 {

background-image : url(liniya_right.jpg);

background-position : 100% 0;

background-repeat : repeat-y;

}

#td127 {

background-image : url(ugol_niz_right.jpg);

background-repeat : no-repeat;

}

#td125 {

background-image : url(ugol_niz_left.jpg);

background-repeat : no-repeat;

}

#td126 {

background-image : url(liniya_niz.jpg);

background-repeat : repeat-x;

}

#td118 {

background-image : url(liniya_verh.jpg);

background-repeat : repeat-x;

font-size : 0;

_____где именно не знаю.

Заранее спасибо всем за понимание и ответы

Switch74 · April 11, 2012

нагорожено тут у вас, проблемы в размерах походу, а вообще лучше попробуйте сделать подругому


<style>
.border-radius{position:relative;}
.border-radius>.top{position:absolute;top:0px;left:0px;right:0px;height:5px;background-image:url(liniya_verh.jpg);}
.border-radius>.bottom{position:absolute;bottom:0px;left:0px;right:0px;height:5px;background-image:url(liniya_niz.jpg);}
.border-radius>.left{position:absolute;top:0px;left:0px;bottom:0px;width:5px;background-image:url(liniya_left.jpg);}
.border-radius>.right{position:absolute;top:0px;bottom:0px;right:0px;width:5px;background-image:url(liniya_right.jpg);}
.border-radius>.lt{position:absolute;top:0px;left:0px;width:5px;height:5px;background-image:url(ugol_verh_left.jpg);}
.border-radius>.lb{position:absolute;bottom:0px;left:0px;width:5px;height:5px;background-image:url(ugol_niz_left.jpg);}
.border-radius>.rt{position:absolute;top:0px;right:0px;width:5px;height:5px;background-image:url(ugol_verh_right.jpg);}
.border-radius>.rb{position:absolute;bottom:0px;right:0px;width:5px;height:5px;background-image:url(ugol_niz_right.jpg);}
</style>
<div class="border-radius">
  <div class="top"></div>
  <div class="bottom"></div>
  <div class="left"></div>
  <div class="right"></div>
  <div class="lt"></div>
  <div class="lb"></div>
  <div class="rt"></div>
  <div class="rb"></div>
  text text text
</div>

что-то вроде этого будет у вас работать как ваши таблици

но я бы избавился по возможности от картинок top bottom left right и сделал их обычным стилем border для border-radius

Stan-86 · April 11, 2012

нагорожено тут у вас, проблемы в размерах походу, а вообще лучше попробуйте сделать подругому


<style>
.border-radius{position:relative;}
.border-radius>.top{position:absolute;top:0px;left:0px;right:0px;height:5px;background-image:url(liniya_verh.jpg);}
.border-radius>.bottom{position:absolute;bottom:0px;left:0px;right:0px;height:5px;background-image:url(liniya_niz.jpg);}
.border-radius>.left{position:absolute;top:0px;left:0px;bottom:0px;width:5px;background-image:url(liniya_left.jpg);}
.border-radius>.right{position:absolute;top:0px;bottom:0px;right:0px;width:5px;background-image:url(liniya_right.jpg);}
.border-radius>.lt{position:absolute;top:0px;left:0px;width:5px;height:5px;background-image:url(ugol_verh_left.jpg);}
.border-radius>.lb{position:absolute;bottom:0px;left:0px;width:5px;height:5px;background-image:url(ugol_niz_left.jpg);}
.border-radius>.rt{position:absolute;top:0px;right:0px;width:5px;height:5px;background-image:url(ugol_verh_right.jpg);}
.border-radius>.rb{position:absolute;bottom:0px;right:0px;width:5px;height:5px;background-image:url(ugol_niz_right.jpg);}
</style>
<div class="border-radius">
  <div class="top"></div>
  <div class="bottom"></div>
  <div class="left"></div>
  <div class="right"></div>
  <div class="lt"></div>
  <div class="lb"></div>
  <div class="rt"></div>
  <div class="rb"></div>
  text text text
</div>

что-то вроде этого будет у вас работать как ваши таблици

но я бы избавился по возможности от картинок top bottom left right и сделал их обычным стилем border для border-radius

Спасибо за совет,но я даже если честно не представляю куда это вставлять...Если можно,то разъясните как для чайника.Заранее спасибо

Switch74 · April 11, 2012

все что между <style> и </style> нужно положить в файлик css, где у вас записаны ваши стили


#td52 {
background-image : url(ugol_verh_left.jpg);
background-repeat : no-repeat;
height : 9px;
}
#td54 {....

а это


<div class="border-radius">
  <div class="top"></div>
  <div class="bottom"></div>
  <div class="left"></div>
  <div class="right"></div>
  <div class="lt"></div>
  <div class="lb"></div>
  <div class="rt"></div>
  <div class="rb"></div>
  text text text
</div>

замена для ваших табличных ссылок

Футболки Майки Туники Юбки

Брюки Капри Шорты Платья


<div class="border-radius" id="table115">
  <div class="top"></div>
  <div class="bottom"></div>
  <div class="left"></div>
  <div class="right"></div>
  <div class="lt"></div>
  <div class="lb"></div>
  <div class="rt"></div>
  <div class="rb"></div>
  Футболки
</div>

и т.д.

надеюсь понятно

Stan-86 · April 11, 2012

все что между <style> и </style> нужно положить в файлик css, где у вас записаны ваши стили
#td52 {
background-image : url(ugol_verh_left.jpg);
background-repeat : no-repeat;
height : 9px;
}
#td54 {....
а это
<div class="border-radius">
  <div class="top"></div>
  <div class="bottom"></div>
  <div class="left"></div>
  <div class="right"></div>
  <div class="lt"></div>
  <div class="lb"></div>
  <div class="rt"></div>
  <div class="rb"></div>
  text text text
</div>
замена для ваших табличных ссылок
Футболки Майки Туники Юбки
Брюки Капри Шорты Платья
<div class="border-radius" id="table115">
  <div class="top"></div>
  <div class="bottom"></div>
  <div class="left"></div>
  <div class="right"></div>
  <div class="lt"></div>
  <div class="lb"></div>
  <div class="rt"></div>
  <div class="rb"></div>
  Футболки
</div>
и т.д.
надеюсь понятно

т.е. после всего кода css в конце добавить вот это?

.border-radius{position:relative;}

.border-radius>.top{position:absolute;top:0px;left:0px;right:0px;height:5px;background-

image:url(liniya_verh.jpg);}

.border-radius>.bottom{position:absolute;bottom:0px;left:0px;right:0px;height:

5px;background-image:url(liniya_niz.jpg);}

.border-radius>.left{position:absolute;top:0px;left:0px;bottom:0px;width:5px;background-

image:url(liniya_left.jpg);}

.border-radius>.right{position:absolute;top:0px;bottom:0px;right:0px;width:5px;

background-image:url(liniya_right.jpg);}

.border-radius>.lt{position:absolute;top:0px;left:0px;width:5px;height:5px;background-

image:url(ugol_verh_left.jpg);}

.border-radius>.lb{position:absolute;bottom:0px;left:0px;width:5px;height:5px;

background-image:url(ugol_niz_left.jpg);}

.border-radius>.rt{position:absolute;top:0px;right:0px;width:5px;height:5px;background-

image:url(ugol_verh_right.jpg);}

.border-radius>.rb{position:absolute;bottom:0px;right:0px;width:5px;height:5px;

background-image:url(ugol_niz_right.jpg);}

Если так,то ничего не происходит...Или я уже вообще ничего не понимаю...

А куда вот это вставлять

Футболки

</div>

вообще не понимаю...

Switch74 · April 11, 2012

я думаю тебе нужно подучить html и css, понять их принцип взаимодействия


<div class="border-radius" id="table115">
...
</div>

заменяет у тебя в верстке


<table id="table115" border="0" cellspacing="0" cellpadding="0" linetitle="Нижняя таблица" logtext="">
...
</table>

и много лишнего кода

блоки внутри


<div class="top"></div>
<div class="bottom"></div>
<div class="left"></div>
<div class="right"></div>
<div class="lt"></div>
<div class="lb"></div>
<div class="rt"></div>
<div class="rb"></div>

позиционируются абсолютно по краю их родителя, который заменяет таблицу,а в них мы будем вставлять картинки бордюра подготовленного для кнопок

в вашем случае косяк происходит из-за того, что размеры в таблице не верно заданы

да и нарезка картинок разных размеров, много лишнего кода не понятно для чего.

постарайтесь освоить css и html и не пользоваться конструкторами

Stan-86 · April 11, 2012

я думаю тебе нужно подучить html и css, понять их принцип взаимодействия
<div class="border-radius" id="table115">
...
</div>
заменяет у тебя в верстке
<table id="table115" border="0" cellspacing="0" cellpadding="0" linetitle="Нижняя таблица" logtext="">
...
</table>
и много лишнего кода
блоки внутри
<div class="top"></div>
<div class="bottom"></div>
<div class="left"></div>
<div class="right"></div>
<div class="lt"></div>
<div class="lb"></div>
<div class="rt"></div>
<div class="rb"></div>
позиционируются абсолютно по краю их родителя, который заменяет таблицу,а в них мы будем вставлять картинки бордюра подготовленного для кнопок
в вашем случае косяк происходит из-за того, что размеры в таблице не верно заданы
да и нарезка картинок разных размеров, много лишнего кода не понятно для чего.
постарайтесь освоить css и html и не пользоваться конструкторами

Спасибо

Sign In

Проблема с таблицами

Question

Stan-86

Link to comment

Share on other sites

6 answers to this question

Recommended Posts

Switch74

Link to comment

Share on other sites

Stan-86

Link to comment

Share on other sites

Switch74

Link to comment

Share on other sites

Stan-86

Link to comment

Share on other sites

Switch74

Link to comment

Share on other sites

Stan-86

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information