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



Левый блок уезжает вправо при уменьшении масштаба

#1

Поделиться сообщением #1



kazyavka

kazyavka
  • Неактивные
  • 9 сообщений
  • Репутация: 0
0

Отправлено 19 Июль 2013 - 10:19

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

вот файл css

body {
			 width: 1330px;
   hight:1451 px;
   margin:0 auto;
			font-family: Trebuchet MS, Arial, Times New Roman;
			font-size: 12px;
   z-index:0;
}
#container {
	  
			background: #FFF; /*цвет контейнера макета*/
   margin: 0px 40px 0 40px;
		
			min-width: 1245px;
   hight:1051 px;
		
}
#header{
width: 1245px;
height: 401px;
background-color:#FFF; /*желтый*/
position: relative; z-index:10;
}
#blok {
margin:  20px 20px 10px 0;
float:left;
width:216px;
hight:650px;
background-image: url(menu/new.png);
background-repeat:no-repeat;
z-index:9;
}
#content{
width:790px;
hight:690px;
margin: 20px 10px 0 230px;
float: top;
background-image: url(menu/chika3.png);
background-repeat:no-repeat;
z-index:5;
}
#sidebar{
margin:  20px 0 0 0;
float:right;
width:216px;
hight:650px;
background-image: url(menu/partner.png);
background-repeat: no-repeat;
z-index:9;
}
#clear {
clear:both;
}
#footer{
background-image:url(menu/podval.png);
height: 90px;
width: 1245px;
z-index:8;
}

надо что бы выглядело так при любом масштабе

Прикрепленные изображения

  • вуаля.jpg
  • вуаля2.jpg

 

 

  • 0

robot

robot
  • Пользователь PRO
  • 2 652 сообщений
  • Репутация: 85
Советую обратить внимание на следующее:
  1. Как подогнать под разные разрешения?
  2. Блоки отображаются не так как хотелось бы
  3. Не могу выровнять меню
  4. Картинка вылезает за границы текста при изменении масштаба
  5. Изменение размера картинки при уменьшении окна браузера

#2

Поделиться сообщением #2



fedornabilkin

fedornabilkin
  • Пользователь
  • 727 сообщений
  • Репутация: 102

Отправлено 19 Июль 2013 - 15:08

сделай жесткий диз. вк вот не парится же. на больших мониторах смотрится не очень привлекательно и все равно там сидят :)
  • -1
Как часто в горестной разлуке,В моей блуждающей судьбе, ФО, я думал о тебе.


#3

Поделиться сообщением #3



webby

webby
  • Неактивные
  • 9 сообщений
  • Репутация: 0

Отправлено 19 Июль 2013 - 18:25

У Вас использована блочная верстка. А нужно использовать табличную верстку или гибридную - таблица+блоки. Если каждый блок (хедер, футер, левая и правая навигация, а также основной контент) будут заключены в свою собственную ячейку в таблице-каркасе, то ничего никуда сползать не будет.

сделай жесткий диз. вк вот не парится же. на больших мониторах смотрится не очень привлекательно и все равно там сидят :)


По картинкам видно, что у человека и так дизайн жесткий (с фиксированной шириной шаблона). При резиновом дизайне (шаблоне) во время уменьшения масштаба шаблон все равно продолжает занимать всю страницу по ширине - например как на этом форуме. Лучше посоветовать использовать табличную верстку вместо блочной.
  • 0

#4

Поделиться сообщением #4



fedornabilkin

fedornabilkin
  • Пользователь
  • 727 сообщений
  • Репутация: 102

Отправлено 19 Июль 2013 - 19:52

использовать табличную верстку вместо блочной

табличная вроде как устаревший вариант.
у меня все сайты на блочной и ничего никуда не едет.
  • 0
Как часто в горестной разлуке,В моей блуждающей судьбе, ФО, я думал о тебе.


#5

Поделиться сообщением #5



isvetlichniy

isvetlichniy
  • Пользователь
  • 622 сообщений
  • Репутация: 93

Отправлено 19 Июль 2013 - 21:12

адаптивный дизайн нужен. автор много хочешь, чтобы и при 100% и при 25%!!!! сайт выглядел одинаково
верстай шаблон для мобильных устройств тогда уже
  • 0

#6

Поделиться сообщением #6



fedornabilkin

fedornabilkin
  • Пользователь
  • 727 сообщений
  • Репутация: 102

Отправлено 19 Июль 2013 - 21:25

isvetlichniy, очень категоричен, но так и есть на самом деле.
А яндекс-детектор поможет определить моб устройство или нет, кстати
  • 0
Как часто в горестной разлуке,В моей блуждающей судьбе, ФО, я думал о тебе.


#7

Поделиться сообщением #7



Гость_AllaWitte_*

Гость_AllaWitte_*
  • Гости

Отправлено 02 Октябрь 2014 - 00:05

У вас заданы фиксированные размеры для блоков. Если вы хотите выдержать дизайн при уменьшении разрешения - то вам нужно размеры блоков задавать в %. Но при этом учитывать, что все margins и paddings добавляются к ширине. Поэтому лучше сделать блоки-контейнеры в %, а в низ уже прописывать блоки с содержимым.


  • 0

#8

Поделиться сообщением #8



Agriiii

Agriiii
  • Пользователь
  • 378 сообщений
  • Репутация: 40

Отправлено 02 Октябрь 2014 - 19:54

Дайте ссылку на сайт.


  • 0

robot

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


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