Нужна фиксированная ширина сайта

@vifelso · Регистрация: 06.11.2014

Студворк — интернет-сервис помощи студентам

Здравствуйте. Подскажите пожалуйста , дали тестовое задание сделать сайт с фиксированной шириной 960px , сделал , но у меня открывает всё равно 1349*978 хотя в обёртке указал 960px. код css не мой поэтому не могу разобрать. Подскажите что нужно поправить.

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
#page-wrapper {
width: 960px;
-moz-backface-visibility: hidden;
-webkit-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
-moz-transition: -moz-transform 0.5s ease;
-webkit-transition: -webkit-transform 0.5s ease;
-ms-transition: -ms-transform 0.5s ease;
transition: transform 0.5s ease;
padding-bottom: 1px;
 
}

Добавлено через 10 минут
вот ссылка на сайт http://t14811ty.bget.ru/

Добавлено через 24 минуты
Или может я правильно сделал просто отображает так? И ещё подскажите что значит большие и малые блоки? В задании сказано большие блоки не более 700px, малые- не более 300px.

@Fedor92 · 17.10.2015, 00:54

vifelso, Вы сделали неправильно... Во-первых, судя по инспектору, для #page-wrapper не указана ширина, на сайте по данной Вами ссылке... Второе, все блоки на странице надо обернуть в один общий блок и задать ему свойства width:960px; margin:0 auto... После чего править поплывшую вёрстку...

@vifelso · 17.10.2015, 01:05 **[ТС]**

Буду пробывать спасибо.

@vifelso · 17.10.2015, 01:14 **[ТС]**

Кода много и я не могу найти где задаётся ширина сайта . Тут сделано для всех разрешений и я путаюсь. Вот приклепляю файл css

@vifelso · 17.10.2015, 01:16 **[ТС]**

А как узнать какие блоки большие какие маленькие?

@Shakalaka · 17.10.2015, 09:55

Сообщение от vifelso

Кода много и я не могу найти где задаётся ширина сайта . Тут сделано для всех разрешений и я путаюсь.

Да вам же понятно написали обернуть все в один див, задать ему ширину и поставить margin:auto; И зачем вы используете какой-то фреймворк, если не знаете как с ним работать? Там верстка выеденного яйца не стоит, а вы городите хз что..

Не по теме:

Сообщение от vifelso

дали тестовое задание сделать сайт с фиксированной шириной 960px

Тестовое задание на работу? Если да, то вам рано еще работать верстальщиком, ибо такие задания не должны вызывать трудностей...

@vifelso · 17.10.2015, 11:09 **[ТС]**

да я исправлял это

CSS
1
2
3
4
5
6
7
8
9
10
11
12
#page-wrapper {
width: 960px;
-moz-backface-visibility: hidden;
-webkit-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
-moz-transition: -moz-transform 0.5s ease;
-webkit-transition: -webkit-transform 0.5s ease;
-ms-transition: -ms-transform 0.5s ease;
transition: transform 0.5s ease;
padding-bottom: 1px;
}

написал это

CSS
1
2
3
4
#page-wrapper {
width: 960px;
margin:auto;
}

и нет результата

Добавлено через 19 минут
во , получилось)

Добавлено через 4 минуты
только как теперь эту кривулину поправлять, а почему строка навигации сама по себе живёт?
она не стала 960 пикселей

@Shakalaka · 17.10.2015, 11:11

Сообщение от vifelso

и нет результата

Перехожу по вашей ссылке и вижу все то же самое...
Еще раз ваша разметка

HTML5
1
2
3
<div id="page-wrapper" style="width: 960px; margin: auto;">...</div>
<div>...</div>
<div id="copyright"> © made by vifelso: </div>

Нужно задать для ВСЕХ тегов один ОБЩИЙ див

HTML5
1
2
3
4
5
<div id='main'>
  <div id="page-wrapper" style="width: 960px; margin: auto;">...</div>
  <div>...</div>
  <div id="copyright"> © made by vifelso: </div>
</div>

CSS
1
2
3
4
#main{
  width:960px;
  margin:auto;
}

И дальше, как вам уже сказалFedor92, править поплывшую верстку, ибо у вас div.container у которого ширина задана 1200 пикселей. Также у вас box-sizing:border-box и есть блоки у которых ширина 960 и паддинги, эти блоки тоже вывалятся за пределы контейнера.

@vifelso · 17.10.2015, 11:46 **[ТС]**

и исправляеться только одна страница
другие просто не видят эту обёртку

Добавлено через 2 минуты
я сделал так только озаглавил не main, а page-wrapperfirst и исправилась только одна страница (главная) в других тоже изменил но её не видит

Добавлено через 6 минут
Сделал всё как вы сказали. Исправилась только главная страница(

@Shakalaka · 17.10.2015, 11:50

Сообщение от vifelso

я сделал так только озаглавил не main, а page-wrapperfirst и исправилась только одна страница (главная) в других тоже изменил но её не видит

Это вы так прикалываетесь? "Я что-то исправил на главной странице, а на остальных ничего не менял и вот беда - изменилась только главная" Это краткий пересказ вашего поста...
У вас сайт статический, меняете разметку на всех станицах, пишите стили в один файл css, подключаете его ко всем страницам, всё.

@vifelso · 17.10.2015, 13:30 **[ТС]**

вообще нечего не понимаю вот код другой страницы

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
    <body>
       <div id="main">
         <div id="page-wrapper">
            <div id="header-wrapper">
                <div class="container">
                    <div class="row">
                        <div class="12u">
 
                            <header id="header">
                                <h1><a href="#" id="logo">Ограды  в Гомеле</a></h1>
                                <nav id="nav">
                                    <a href="index.html">домашняя страница</a>
                                    <a href="twocolumn1.html">продукция</a>
                                    <a href="twocolumn2.html">о нас</a>
                                    <a href="onecolumn.html" class="current-page-item">контакты</a>
                                </nav>
                            </header>
 
                        </div>
                    </div>
                </div>
            </div>
            <div id="main">
                <div class="container">
                    <div class="row main-row">
                        <div class="12u">
 
                            <section>
                                <h2>введу телефоны и адреса</h2>
 
                            </section>
 
                        </div>
                    </div>
                </div>
            </div>
            <div id="footer-wrapper">
                <div class="container">
                    <div class="row">
                        
                        
                    </div>
                    <div class="row">
                        <div class="12u">
 
                        <div id="copyright">
                                &copy; made by vifelso: 
                            </div>
 
                        </div>
                    </div>
                </div>
            </div>
           </div>
        </div>
             
    </body>
</html>

Добавлено через 4 минуты
Да я поменял на всех страницах

Добавлено через 55 секунд
main видит внутри page-wrapper

Добавлено через 4 минуты
Вообще ничего не понимаю, как main оказываеться внутри page-wraperr?

Добавлено через 1 минуту
Теги проверил, всё вроде закрыто

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

Добавлено через 17 минут
Есть идеи?

Добавлено через 2 минуты
А там походу два main

Добавлено через 11 минут
Нет майн тоже не причём(, просто не видит обёртки главной(

Добавлено через 1 минуту
И что само прикольно <div id="page-wrapper" style="width: 960px; margin: auto;"> в принципе только это строчка уже должна всё исправлять

Добавлено через 17 минут
а вот хром нормально показывает)

Добавлено через 27 минут
кароч, это был глюк -ctrl+f5

Новые блоги и статьи Все статьи Все блоги /
моя боль iceja 24.01.2026 Выложила интерполяцию кубическими сплайнами www. iceja. net REST сервисы временно не работают, только через Web. Написала за 56 рабочих часов этот сайт с нуля. При помощи perplexity. ai PRO , при. . .	Модель сукцессии микоризы anaschu 24.01.2026 Решили писать научную статью с неким РОманом	http://iceja.net/ математические сервисы iceja 20.01.2026 Обновила свой сайт http:/ / iceja. net/ , приделала Fast Fourier Transform экстраполяцию сигналов. Однако предсказывает далеко не каждый сигнал (см ограничения http:/ / iceja. net/ fourier/ docs ). Также. . .	http://iceja.net/ сервер решения полиномов iceja 18.01.2026 Выкатила http:/ / iceja. net/ сервер решения полиномов (находит действительные корни полиномов методом Штурма). На сайте документация по API, но скажу прямо VPS слабенький и 200 000 полиномов. . .
Расчёт переходных процессов в цепи постоянного тока igorrr37 16.01.2026 / * Дана цепь(не выше 3-го порядка) постоянного тока с элементами R, L, C, k(ключ), U, E, J. Программа находит переходные токи и напряжения на элементах схемы классическим методом(1 и 2 з-ны. . .	Восстановить юзерскрипты Greasemonkey из бэкапа браузера damix 15.01.2026 Если восстановить из бэкапа профиль Firefox после переустановки винды, то список юзерскриптов в Greasemonkey будет пустым. Но восстановить их можно так. Для этого понадобится консольная утилита. . .	Сукцессия микоризы: основная теория в виде двух уравнений. anaschu 11.01.2026 https:/ / rutube. ru/ video/ 7a537f578d808e67a3c6fd818a44a5c4/	WordPad для Windows 11 Jel 10.01.2026 WordPad для Windows 11 — это приложение, которое восстанавливает классический текстовый редактор WordPad в операционной системе Windows 11. После того как Microsoft исключила WordPad из. . .

@Fedor92 2964 / 2621 / 1068 Регистрация: 15.12.2012 Сообщений: 10,091 Записей в блоге: 11
	17.10.2015, 00:54
	vifelso, Вы сделали неправильно... Во-первых, судя по инспектору, для #page-wrapper не указана ширина, на сайте по данной Вами ссылке... Второе, все блоки на странице надо обернуть в один общий блок и задать ему свойства width:960px; margin:0 auto... После чего править поплывшую вёрстку... 1

@vifelso 1 / 1 / 2 Регистрация: 06.11.2014 Сообщений: 346
	17.10.2015, 01:05 [ТС]
	Буду пробывать спасибо. 0

@vifelso 1 / 1 / 2 Регистрация: 06.11.2014 Сообщений: 346
	17.10.2015, 01:16 [ТС]
	А как узнать какие блоки большие какие маленькие? 0

@vifelso 1 / 1 / 2 Регистрация: 06.11.2014 Сообщений: 346
	17.10.2015, 11:46 [ТС]
	и исправляеться только одна страница другие просто не видят эту обёртку Добавлено через 2 минуты я сделал так только озаглавил не main, а page-wrapperfirst и исправилась только одна страница (главная) в других тоже изменил но её не видит Добавлено через 6 минут Сделал всё как вы сказали. Исправилась только главная страница( 0