Меню
Что нового?

проблема с вёрсткой

berkut

Новичок
проблема с вёрсткой

Помогите решить проблемку с вёрсткой. Вот пример:
Код: 
<table border="1">
  <tr>
      <td width="200">
        <!-- block -->
	text text text text text text text text
	<table width="100" height="100" border="1">
           <tr>
	    <td><font color="red">inner table</font></td>
	  </tr>
	</table>
	text text text text text text text text<br>
         <!-- end of block -->
	<font color="#003399">а этот текст, должен всегда распологаться под таблицей(inner table)</font>		
      </td>
  </tr>
</table>
текст, который выделен синим цветом, должен распологаться под вложенной таблицей. пробывал заключать в <div style="width: inherit"> блоки с вложенной таблицей - но это работает только в опере и мозилле, а в ие нет
 

ksnk

прохожий
Не догоняю :)
должен распологаться под вложенной таблицей
Нажмите для раскрытия...
А разве сейчас он располагается над?

Или он должен быть плотно приклеен к таблице?

-~{}~ 17.09.06 19:44:

P.S. Oops! опоздал....
 

berkut

Новичок
у меня он распологаеться слева от таблицы, в 3 браузерах (firefox, opera9, ie6) уже и размер шрифта менял - всё равно слева от таблицы
 

Кром

Новичок
У меня в (firefox, opera8, ie6, mozilla) текст располагается под таблицей. Так что проверяй как на этот блок воздействуют внешние блоки, css и т.д. Как отдельный блок он отображается так как тебе надо.
 

berkut

Новичок
извиняюсь, не тот код запостил, хотел как можно больше всего упростить - разница лишь в том, что к вложенной таблице нужно применить атрибут align="right" тогда всё становиться плохо.
Вот страница ___TEST.htm
и скриншоты, как я её вижу:
IE 6
Opera 9
FireFox 1.5.0.1
 

an_kalinovski

Новичок
Объясни что ты хочешь видеть в конечном итоге а не как это сделал ты, плиз... Это пипка маленькая с текстом и таблицей - вне ее что? она будет растягиватся или нет, что ее обрамляет и т.п.
 

berkut

Новичок
всё это дело находится в ячейке таблицы с фиксированной шириной. Вложенная таблица фиксированных размеров(там по идее рисунок), а синий текст должен распологаться под вложенной таблицей (inner table) вот и всё
 

denver

?>Скриптер
berkut
Один лишний </tr> верстке дивами - пофиг, а табличную верстку разрывает на куски.

Если блок не там где надо, сперва убедись что документ валиден (validator.w3.org).
 

berkut

Новичок
лишних </tr> там не было. Проверил валидатором - 2 ошибки - у STYLE не указан type, и не должно-быть аттрибута height у таблицы. исправил - теперь html валидный. для наглядности уменьшил кол-во текста до и после таблицы - всё равно то-же самое, проблема остаётся
 

an_kalinovski

Новичок
мдя... мне не по зубам то что ты задумал... могу предложить только такой вариант


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style>
div#content {width:200px;;}
div.photo {float:left;}
div {border:1px solid black}
</style>
</head>
<body>
<div id="content">
<div>***</div>
<div class="photo"><img src="photo.gif" width="50" height="50"/></div>
<div class="right">Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla
</div>
<div>***</div>
</div>
</body>
</html>
 
baev

baev

‹°°¬•
Команда форума
berkut, всё гениальное — просто:
Код: 
<div style="clear:both"></div>
— это вставьте перед «синим текстом».
 

zarus

Хитрожопый макак
Код: 
<table border="1"> 
    <tr> 
        <td width="200" valign="top"> 
		    <p>
            <!-- block --> 
			<div style="float: right;" align="right"><table width="100" border="1">
                <tr><td><font color="red">inner table</font></td></tr> 
            </table></div>
            text text text text text text text text
            text
            <!-- end of block --> 
			</p>
			<p>
            <font color="#003399">а этот текст, должен всегда распологаться под таблицей(inner table)</font> 
			</p>
		</td> 
    </tr> 
</table>
?
 

Кром

Новичок
berkut
Там у тебя в таблице лишний align="right", он и отвечает за сдвиг таблицы вправо и обтекание ее текстом слева.
Вообще, это проблема копеечная и решается различными способами в течении пары секунд, естественно не теми методами, которые тут предлагают некоторые html-специалисты.
 
akxxiv

akxxiv

Новичок
Автор оригинала: baev
berkut, всё гениальное — просто:
Код: 
<div style="clear:both"></div>
— это вставьте перед «синим текстом».
Нажмите для раскрытия...
Согласен.
Ну, или на крайняк там же поставь <br clear="all">
 

berkut

Новичок
Вот спасибо! <div style="clear:both"></div> и <br clear="all"> - это круть! Буду знать
 
Войдите или зарегистрируйтесь для ответа.
Сверху