Jump to content
  • 0

<td> --> <div>

HotCoffee

Asked by HotCoffee,

 Share

Question

HotCoffee Explorer

HotCoffee

Posted
Posted

такой случай: надо сделать несколько блоков один под другим

(ну это понятно - второй и следующие relative)

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

(код div-ов написан в этой ячейке)

долго уже бьюсь. подскажите пожалуйста.

Link to comment
Share on other sites

8 answers to this question

Recommended Posts

  • 0
HotCoffee Explorer

HotCoffee

Posted
  • Author
Posted

я просто не знаю как это сделать. первый блок если absolute делать то он от угла окна позиционируется

просто хочу чтобы блоки висели над ячейками, а ячейки я сам растяну по высоте всех блоков, так чтобы блоки были на фоне ячеек "РЕПИТ" и "НИЗ"

<table class="mt" cellpadding="0" cellspacing="0">
<tr>
<td>
<td class="bann">  </td>
<td>

<tr>
<td class="menu">  </td>
<td class="menu">
<nobr>
<a href="abu.html">S</a> <img src="pic/str.gif">
<a href="aer.html">А</a> <img src="pic/str.gif">
<a href="inc.html">И</a> <img src="pic/str.gif">
<a href="pri.html">П</a> <img src="pic/str.gif">
<a href="con.html">К</a>
</nobr>
</td>
<td class="menu">  </td>

<tr>
<td>
	<td class="cont">
	<div class="ctt" style="position:fixed; margin-left:33px; width:710px;">
	  <p><img class="ctt" width="140" height="189" src="index_clip_image002.jpg" align="left" hspace="1" alt="D14.jpg"> йцукен</p>
	</div> ?	

	<div class="ctt" style="margin-left:33px; width:710px; position: fixed; top:717px; left: 14px;">
	  <h3>  И</h3>
	  <p>Отличный</p></div> 
		  <div class="ctt" style="margin-left:33px; margin-top:10px; width:710px; position: fixed; left: -200px; top: 80px;">
	  <h3>  Ин</h3>
	  <p>Вряд ли</p></div>?
		  <div class="ctt" style="margin-left:33px; margin-top:10px; width:710px; position: fixed; left: 14px; top: 973px;">
	  <h3>  Инк</h3>
	  йцукен</div>	   

	<div class="ctt" style="position:static; margin-left:33px; margin-top:10px; width:710px; top: 50px; left: 14px; z-index: 2;">
	  <p><img width="140" height="189" src="index_clip_image002.jpg" align="left" hspace="12" alt="4.jpg"><strong>А</strong>, а также</p>
	  <p>Мо</p>
	</div>
	? 

	</td>
<td>

<tr>
<td>
<td background="pic/2rep.gif" style="background-repeat: repeat-y"> РЕПИТ
<td>


<tr>
<td>
<td background="pic/2bottom.gif" style="background-repeat:no-repeat"> НИЗ
<td>


<tr>
<td class="copy">  </td>
<td class="copy"><A style="color:#0000f6;" HREF="mailto:ngc3034@mail.ru?subject =EM">Designed  by  </A></td>
<td class="copy">  </td>
</table>

Link to comment
Share on other sites
  • 0
HotCoffee Explorer

HotCoffee

Posted
  • Author
Posted

кстати я любитель если что :lol:

доктайп насколько я понимаю text/css, т.е. просто html.

вот впринципе такая вещь должна плучиться

Untitled-1.gif

но это я подогнал просто, если растянуть окошко блоки сползут влево с зеленого фона. ячейки с фоном я сам растягиваю, смотря сколько блоков

Link to comment
Share on other sites
  • 0
Scrum Explorer

Scrum

Posted
Posted

Да картинка тож ничего не прояснила, в какую область капать, где чего не получается ?

Для тех кто понял, немного форматнул верстку.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>margin</title>
</head>
<body>
	<table class="mt" cellpadding="0" cellspacing="0">
	<tr>
		<td class="bann"> </td>
	</tr>
	<tr>
		<td class="menu">  </td>
		<td class="menu">
			<nobr>
				<a href="abu.html">S</a> <img src="pic/str.gif">
				<a href="aer.html">А</a> <img src="pic/str.gif">
				<a href="inc.html">И</a> <img src="pic/str.gif">
				<a href="pri.html">П</a> <img src="pic/str.gif">
				<a href="con.html">К</a>
			</nobr>
		</td>
		<td class="menu">  </td>
	</tr>
	<tr>
		<td class="cont">
			<div class="ctt" style="position:fixed; margin-left:33px; width:710px;">
				<p>
					<img class="ctt" width="140" height="189" src="index_clip_image002.jpg" align="left" hspace="1" alt="D14.jpg"> йцукен
				</p>
			</div>
			<div class="ctt" style="margin-left:33px; width:710px; position: fixed; top:717px; left: 14px;">
				<h3>  И</h3>
				<p>Отличный</p>
			</div>
			<div class="ctt" style="margin-left:33px; margin-top:10px; width:710px; position: fixed; left: -200px; top: 80px;">
				<h3>  Ин</h3>
				<p>Вряд ли</p>
			</div>
			<div class="ctt" style="margin-left:33px; margin-top:10px; width:710px; position: fixed; left: 14px; top: 973px;">
				<h3>  Инк</h3>
				йцукен
			</div>
			<div class="ctt" style="position:static; margin-left:33px; margin-top:10px; width:710px; top: 50px; left: 14px; z-index: 2;">
				<p>
					<img width="140" height="189" src="index_clip_image002.jpg" align="left" hspace="12" alt="4.jpg">
					<strong>А</strong>, а также
				</p>
				<p>Мо</p>
			</div>
		</td>
	</tr>
	<tr>
		<td background="pic/2rep.gif" style="background-repeat: repeat-y"> РЕПИТ</td>
	</tr>
	<tr>
		<td background="pic/2bottom.gif" style="background-repeat:no-repeat"> НИЗ</td>
	</tr>
	<tr>
		<td class="copy">  </td>
		<td class="copy"><A style="color:#0000f6;" HREF="mailto:ngc3034@mail.ru?subject =EM">Designed  by  </A></td>
		<td class="copy">  </td>
	</tr>
</table>
</body>
</html>

p/s/

quot;-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

это доктайп.

Link to comment
Share on other sites
  • 0
HotCoffee Explorer

HotCoffee

Posted
  • Author
Posted
Да картинка тож ничего не прояснила, в какую область капать, где чего не получается ?

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

верхняя часть в верхней ячейке

средняя часть во второй - эту ячейку можно растягивать а фонавая картинка размножается сколько угодно

нижняя часть в последней 3-й ячейке

т.о. я растягиваю вторую ячейку до тех пор пока последний блок текста не окажется над нижней завитушкой :lol:

и все бы хорошо, но как в резиновом дизайне расположить absolute блоки над ячейками с фоном?

это доктайп

а у меня дримвэйвер его не выводит в шаблоне. свой домашний сайт я без него делал и вроде все ок.

Link to comment
Share on other sites
  • 0
HotCoffee Explorer

HotCoffee

Posted
  • Author
Posted

вобщем докалупался, у меня же эта ячейка всегда посередине, поэтому просто ставлю див между

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

однако теперь друггой вопрос: как без использование php подключить css в зависимости от браузера?

<script type="text/javascript">

DOM = document.getElementById;

Netscape4 = document.layer;

Netscape6 = Mozilla = (navigator.appName == "Netscape") && DOM;

Netscape7 = navigator.userAgent.indexOf("Netscape/7") >= 0;

Opera5 = window.opera && DOM;

Opera6 = Opera5 && window.print;

Opera7 = Opera5 && navigator.userAgent.indexOf("Opera 7") >= 0;

IE = document.all && !Opera5;

Firefox = navigator.userAgent.indexOf("Firefox") >= 0;

if(IE) document.write("");

else document.write("");

это не работает.

выложите пожалуйста какой-нить реальный кусочек кода до

пожалуйста, для примера.
Link to comment
Share on other sites
  • 0
maddogrts Explorer

maddogrts

Posted
Posted 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="Keywords" content="i" />
<meta name="Description" content="o." />
<meta name="verify-v1" content="vVLSX21Ro63jvyUBWPQLOYklEC69drhnDE5fPHOGd6Y=" />
<link href="/css/main.css" media="screen" rel="stylesheet" type="text/css" />
<link href="/css/content.css" media="screen" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/js/main.js"></script>
<script type="text/javascript" src="/js/calendar.js"></script>
<script type="text/javascript" src="/js/common.js"></script>
<script type="text/javascript" src="/js/pop.js"></script>
<script type="text/javascript" src="/js/gallery.js"></script>
<!--[if IE]><link href="/css/ie.css" media="screen" rel="stylesheet" type="text/css" /><![endif]-->
<style type="opera/css"><!--/*--><![CDATA[/*><!--*/.more { margin-top:20px; }/*]]>*/--></style>
<style type="text/css">
  <!--/*--><![CDATA[/*><!--*/
	@import url(/css/dhtmlgoodies_calendar.css);
  /*]]>*/-->
</style>
</head>

Link to comment
Share on other sites
Guest
This topic is now closed to further replies.
 Share
Go to question listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept