Вопрос по адаптивной верстке

30

widg

10 августа 2017, 20:22

1909

Попробовал найти старую тему с гуру по этому вопросу, но так и не смог.

Господа верстальщики, глаз замылился и мозг опух. Если не сложно, пожалуйста, помогите решить вопрос с адаптивной версткой колонки.

Была страница с двумя колонками. Вот стиль этих колонок в основе:

.left_blok{display:block; float:left; width:205px; padding:11px 15px 50px 30px;}
.cont_blok{display:block; float:left; width:726px; padding:11px 20px 30px 0px; text-align:left;}

Задача была сделать фуловую страничку, и я добавил новый див:

.full_page {display:block; float:left; width:960px; padding:11px 18px 30px 18px; text-align:left;}

В десктопах все нормально, но теперь не могу отработать этот блок для девайсов :(

Вот разрешения сидящие в css, но кроме основного содержимого .left_blok и .cont_blok ни в одном из них не участвуют. При этом отображаются везде корректно. А мой "бастард" .full_page никак не хочет вписываться в адаптацию :(

@media only screen and (max-width : 1000px)

@media only screen and (max-width : 768px)

@media only screen and (max-width : 760px)

@media only screen and (max-width : 620px)

@media only screen and (max-width : 440px)

прострация

S

469

Sitealert

10 августа 2017, 20:37

#1

widg:
.full_page никак не хочет вписываться в адаптацию

А Вы его силком впишите. Не хочет - заставим (С)

Отпилю лишнее, прикручу нужное, выправлю кривое. Вытравлю вредителей.

30

widg

10 августа 2017, 20:39

#2

Sitealert, этож не курилка. По существу, если есть мысли, буду признателен.

S

469

Sitealert

10 августа 2017, 20:41

#3

Ответ по существу возможен только на вопрос по существу. А лично я как понял, так и ответил. Честно, без злого умысла. Излагайте задачу чётче.

И да, на ретине 2560 вся эта красота наверняка слетит.

30

widg

10 августа 2017, 20:49

#4

Sitealert, куда четче? Есть две колонки в стилях работающие в любом разрешении. Стили указал. Добавил колонку на всю ширину новым стилем, его тоже в стартпосте указал.

Он работает только в десктопе корректно. В девайсах - не работает.

Какую инфу еще дать?

S

469

Sitealert

10 августа 2017, 20:56

#5

widg:
В девайсах - не работает.

Ну так пропишите, чтобы работало. Откуда мне знать, чего Вы не умеете делать, а что умеете? Вы пока что вообще ничего не прописали в стилях, только заготовки показали.

199

Arsh

10 августа 2017, 20:59

#6

widg:
Он работает только в десктопе корректно.

Но Вы же ширину в пикселях указали (абсолютно, т.е.) - как он может в дивайсах корректно работать?

1

S

469

Sitealert

10 августа 2017, 21:01

#7

Вот так, например, Вы умеете делать?

@media only screen and (max-width: 768px){
  .full_page {
    width:750px;
  }
}

30

widg

10 августа 2017, 21:03

#8

Sitealert:
Ну так пропишите, чтобы работало. Откуда мне знать, чего Вы не умеете делать, а что умеете? Вы пока что вообще ничего не прописали в стилях, только заготовки показали.

Причем здесь заготовки? Это то, что прописано сейчас в стилях.

Ида:

Вот разрешения сидящие в css, но кроме основного содержимого .left_blok и .cont_blok ни в одном из них не участвуют.

Т.е. в стилях:

@media only screen and (max-width : 1000px)

@media only screen and (max-width : 768px)

@media only screen and (max-width : 760px)

@media only screen and (max-width : 620px)

@media only screen and (max-width : 440px)

.left_blok и .cont_blok вообще не прописаны, но отображаются корректно.

ЗЫ Не понимаю смысла постить, абы постить.

---------- Добавлено 11.08.2017 в 00:06 ----------

Arsh:
Но Вы же ширину в пикселях указали (абсолютно, т.е.) - как он может в дивайсах корректно работать?

Arsh, в пикселях, потому что два работающих дива были также прописаны. Их писал не я. Я просто добавил третий, объединив эти два. Больше у них нет в css никаких упоминаний, при этом отображаются корректно.

---------- Добавлено 11.08.2017 в 00:17 ----------

Пора спать идти. Утро вечера мудренее :) Нельзя перерабатывать.

168

dma84

11 августа 2017, 08:00

#9

widg:
Sitealert, куда четче? Есть две колонки в стилях работающие в любом разрешении. Стили указал. Добавил колонку на всю ширину новым стилем, его тоже в стартпосте указал.
Он работает только в десктопе корректно. В девайсах - не работает.

Какую инфу еще дать?

Сайт показать, а все ваши чёткие писюльки никому нафиг не нужны.

30

widg

11 августа 2017, 09:29

#10

Всех благодарю за внимание. На свежую голову, сразу решил проблему. Оставил для нового блока исключительно отступы в padding и все стало шикарно.

ЗЫ Арш оказался наиболее ценным советчиком :)

1

Вышел новый Яндекс Браузер с YandexGPT и YandexART

Что делать, если ваша email-рассылка попала в спам