Резиновый сайт - HTML и CSS - Страница 2

Syltan · 02.09.2010, 00:06

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

Код:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title>Видео</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">

<style type="text/css">
.shapkafon{background:url(img/fon.jpg); repeat-x; }
 body{min-width:800px; overflow:hidden;}
.marginpadding{margin:0px; padding:0px;}
.bordur{border:1px solid black;}
.menubordur {border: #000 solid 1px; border-top:0;}
.d img{display:block; }
</style>

</head>
<body class="marginpadding"> 

<!-- ШАПКА -->
<table  class="bordur"  width="100%"  cellspacing="0" cellpadding="0" >
<tr >
 <td colspan="3" class="shapkafon">
     <img   src="img/header.jpg"  height="180" align="left" >
 </td>
</tr>

<!-- СЕРЕДИНА -->
<tr >
   <td width="15%">
      <div class="d">
        <img  src="img/videoyroki.png"  >
         <img src="img/n1.png"  >
         </div>

         
   </td>
  <td class="bordur" > С новым годом!</td>
       
    <td width="15%" align="right">
      <div class="d">
        <img  src="img/videoyroki.png"  >
         <img src="img/n1.png"  >
         </div>


</tr>

</table>
</body>
</html>

slips · 02.09.2010, 00:11

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

warden4 · 02.09.2010, 09:01

Люди жизнь заставила заняться сайтом. Чел подарил мне готовый конструктор взялся его переделывать под себя и затупил. Суть в следующим . На главной странице писал текст и сделал так чтобы последнее словосочетание было ссылкой на другую страницу. Пока создавал другую станицу главная перестала быть главной. теперь когда заходиш на сайт вместо главной страницы список страниц. Как вернуть страницу обратно тоесть сделать главной? Хелп

Syltan · 02.09.2010, 14:02

В браузере ИЕ, сдвигов при разрешении 800х600 обрезка происходит изображения справа,навигацию обрезает, а сдвигов навигации влево не происходит, а в др. браузерах сдвиг происходит со странными пустотами. Вот я для теста всё сделал и посомтрите что за бред вышел.

Syltan · 02.09.2010, 16:38

Вот код.

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title>Видео</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style type="text/css">
*{margin:0; padding:0;}
body{min-width:800px; overflow:hidden;}
img {border: none;}
.shapkafon {background:url(img/fon.jpg); repeat-x; }
.shapkafon img { text-align:left;}
.bordur {width: 100%; border-collapse:collapse;}
.bordur td {border:1px solid black;}
.menubordur {border: 1px solid black; border-top:none;}
.d {width:15%;}
.d img {display:block;}
</style>
</head>

<body class="marginpadding">

<!-- ШАПКА -->
<table class="bordur">
<tr >
<td colspan="3" class="shapkafon" >
<img src="img/header.jpg" >
</td>
</tr>
<!-- СЕРЕДИНА -->
<tr >
<td class="d">
<img src="img/videoyroki.png" >
<img src="img/n1.png" >
</td>
<td> С новым годом!</td>
<td class="d">
<img src="img/videoyroki.png" >
<img src="img/n1.png" >
</tr>
</table>

</body>
</html>

Сейчас у меня экран размером 1280х1024. Этот архив при запуске файла индекс, отображает вот такое в браузере ИЕ7,Опера, Мозила.
Нормально как я хотел. Вот фото отображения в ИЕ,Опера,Мозила.
http://ipicture.ru/uploads/100902/p1jvhCuL1x.jpg

В браузере гуглхром вот такую ерунду отображает.
http://ipicture.ru/uploads/100902/GUuVs4Uh7I.jpg

1)Проблема №1, неправильно отображение в браузере ГУГлхром, в самом начале при большом разрешении,скажите как исправить?

2) 2-ая проблема, вот что произойдёт ,если сменить разрешение экрана на 800х600, и проверить отображение
в браузере ИЕ,МОЗИЛА,ОПЕРА.
Вот что произойдёт,с чем я не могу побороться и в чём была главная проблема всей этой темы.

http://ipicture.ru/uploads/100902/3QDVOy6dpa.jpg

Syltan · 02.09.2010, 17:38

Вот так сработало,вот что я хотел получить при маленьком разрешении экраеа,наконец-то.

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title>Видео</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style type="text/css">
* {margin:0; padding:0;}
body{overflow:hidden;}
img {border: none;}
.shapka {height: 155px; background:url(img/header.jpg) no-repeat; }
.shapkafon {height: 155px; background:url(img/fon.jpg) repeat-x; }
.shapkafon img { text-align:left;}
.bordur {width: 100%; border-collapse:collapse;}
.bordur td {border:1px solid black;}
.menubordur {border: 1px solid black; border-top:none;}
.d {width:15%;}
.d img {display:block;}
</style>
</head>

<body class="marginpadding">

<!-- ШАПКА -->
<table class="bordur">
<tr >
<td colspan="3" class="shapkafon" >
<div class="shapka" ></div>
</td>
</tr>
<!-- СЕРЕДИНА -->
<tr >
<td class="d">
<img src="img/videoyroki.png" >
<img src="img/n1.png" >
</td>
<td> С новым годом!</td>
<td class="d">
<img src="img/videoyroki.png" >
<img src="img/n1.png" >
</tr>
</table>

</body>
</html>

Syltan · 02.09.2010, 18:39

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

02.09.2010, 00:11	#12
slips Форумчанин Регистрация: 28.10.2008 Сообщений: 350	1.Прикрепите изображение пожалуйста, может я вьеду что вы хотите. 2.И в каком браузере смотреть. + ко всему у вас в выше приведённом коде последний тег td не закрыт Всё о Слот автоматах и Рейтинг Топ 10 казино Последний раз редактировалось slips; 02.09.2010 в 00:13.

02.09.2010, 16:38	#15
Syltan Заблокирован Регистрация: 27.08.2009 Сообщений: 569	Вот код. Код: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head><title>Видео</title> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <style type="text/css"> *{margin:0; padding:0;} body{min-width:800px; overflow:hidden;} img {border: none;} .shapkafon {background:url(img/fon.jpg); repeat-x; } .shapkafon img { text-align:left;} .bordur {width: 100%; border-collapse:collapse;} .bordur td {border:1px solid black;} .menubordur {border: 1px solid black; border-top:none;} .d {width:15%;} .d img {display:block;} </style> </head> <body class="marginpadding"> <!-- ШАПКА --> <table class="bordur"> <tr > <td colspan="3" class="shapkafon" > <img src="img/header.jpg" > </td> </tr> <!-- СЕРЕДИНА --> <tr > <td class="d"> <img src="img/videoyroki.png" > <img src="img/n1.png" > </td> <td> С новым годом!</td> <td class="d"> <img src="img/videoyroki.png" > <img src="img/n1.png" > </tr> </table> </body> </html> Сейчас у меня экран размером 1280х1024. Этот архив при запуске файла индекс, отображает вот такое в браузере ИЕ7,Опера, Мозила. Нормально как я хотел. Вот фото отображения в ИЕ,Опера,Мозила. http://ipicture.ru/uploads/100902/p1jvhCuL1x.jpg В браузере гуглхром вот такую ерунду отображает. http://ipicture.ru/uploads/100902/GUuVs4Uh7I.jpg 1)Проблема №1, неправильно отображение в браузере ГУГлхром, в самом начале при большом разрешении,скажите как исправить? 2) 2-ая проблема, вот что произойдёт ,если сменить разрешение экрана на 800х600, и проверить отображение в браузере ИЕ,МОЗИЛА,ОПЕРА. Вот что произойдёт,с чем я не могу побороться и в чём была главная проблема всей этой темы. http://ipicture.ru/uploads/100902/3QDVOy6dpa.jpg

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
CSS: резиновый сайт с применением position: absolute	Aliech	HTML и CSS	9	15.11.2009 23:38
css. не получается поменять области местами. резиновый макет.	sergey_kalinin	HTML и CSS	2	09.07.2009 16:48
Как выкладывать свой сайт в интернет, Как мне выложить сайт,	psywalker	HTML и CSS	6	21.05.2009 15:04
Резиновый сайт	Helen_Sof	HTML и CSS	4	09.02.2009 19:08

02.09.2010, 09:01	#13
warden4 Новичок Джуниор Регистрация: 02.09.2010 Сообщений: 1	Люди жизнь заставила заняться сайтом. Чел подарил мне готовый конструктор взялся его переделывать под себя и затупил. Суть в следующим . На главной странице писал текст и сделал так чтобы последнее словосочетание было ссылкой на другую страницу. Пока создавал другую станицу главная перестала быть главной. теперь когда заходиш на сайт вместо главной страницы список страниц. Как вернуть страницу обратно тоесть сделать главной? Хелп

02.09.2010, 18:39	#17
Syltan Заблокирован Регистрация: 27.08.2009 Сообщений: 569	Извиняюсь, если кто знает как можно тот же самый результат получить на дивах без использования таблицы, напишите пожалуйста. Чтоб так же имено работало при разных разрешениях экрана. Заранее благодарю.