Posted 12 мая, 20177 yr comment_128348 Здравствуйте. Делаю тут "домашнюю работу" и не могу понять, почему #container в котором находится всё не выравнивается по центру margin: auto;html Спойлер <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"/> <title>House Max</title> <link rel="stylesheet" type="text/css" href="style.css"/> </head> <body> <div id="container"> <div id="header"></div> <div id="bar"> <div id="menu"><font><b>Заказать проект</b></font></br> <font1><b>Категории проектов</b></font1> <ol> <li><a href="#"><b>Проекты таунхаусов и блокированных домов</b></a></li> <li><a href="#"><b>Проекты домов на две семьи</b></a></li> <li><a href="#"><b>Проекты узких домов</b></a></li> <li><a href="#"><b>Проекты бань</b></a></li> </ol> </div> </div> <div id="main"></div> </div> </body> </html> css Спойлер #container { margin: auto; } #header { border: 1px solid black; width: 63%; height: 193px; background: url(img/shapka_div.jpg); } #bar { float:left; border-left: 1px solid black; border-right: 1px solid black; border-bottom: 1px solid black; background: url(img/bar.jpg); background-size: cover; width: 17.3%; height: 600px; } #main { border-right: 1px solid black; border-bottom: 1px solid black; float: left; border-top: 2px; background: url(img/main.jpg); background-size: cover; width: 45.6%; height: 600px; } /* правая часть сайта bar */ #menu { padding-top: 15px; } ol { margin-left: -10px; margin-top: 2px; } font { margin-left: 20px; margin-bottom: 5px; font-size: 20px; } font1 { margin-left: 20px; font-size: 15px; } a { color: #E42900; text-decoration: none; } a:hover { color: blue; text-decoration: underline; } Link to comment https://ipbmafia.ru/topic/17342-pochemu-ne-vyravnivaetsya-po-centru/ Share on other sites Больше вариантов
12 мая, 20177 yr comment_128350 может нужно: margin: 0 auto; Link to comment https://ipbmafia.ru/topic/17342-pochemu-ne-vyravnivaetsya-po-centru/?&do=findComment&comment=128350 Share on other sites Больше вариантов
12 мая, 20177 yr Author comment_128372 7 часов назад, WOLF сказал: может нужно: margin: 0 auto; не помогает Link to comment https://ipbmafia.ru/topic/17342-pochemu-ne-vyravnivaetsya-po-centru/?&do=findComment&comment=128372 Share on other sites Больше вариантов
12 мая, 20177 yr comment_128373 7 часов назад, maxaent сказал: , почему #container в котором находится всё не выравнивается по центру margin: auto; Так а чего тебе надо выровнять? container или то что в нем? Link to comment https://ipbmafia.ru/topic/17342-pochemu-ne-vyravnivaetsya-po-centru/?&do=findComment&comment=128373 Share on other sites Больше вариантов
12 мая, 20177 yr comment_128374 Поставит headar перед container .... попробуйте снова Link to comment https://ipbmafia.ru/topic/17342-pochemu-ne-vyravnivaetsya-po-centru/?&do=findComment&comment=128374 Share on other sites Больше вариантов
12 мая, 20177 yr comment_128380 Есть 2 основных способа выравнивания по центру (их больше, но еще раз, основыных 2). Родителю text-align: center? потомку или margin: 0 auto или display: inline-block Link to comment https://ipbmafia.ru/topic/17342-pochemu-ne-vyravnivaetsya-po-centru/?&do=findComment&comment=128380 Share on other sites Больше вариантов
12 мая, 20177 yr comment_128381 Интересно, а как он должен выровняться, если он во всю ширину body? Нужно же как-то понять, что он выровнялся, для этого хотя бы установить ширину, например width:90%; Link to comment https://ipbmafia.ru/topic/17342-pochemu-ne-vyravnivaetsya-po-centru/?&do=findComment&comment=128381 Share on other sites Больше вариантов
12 мая, 20177 yr Author comment_128386 11 минут назад, Respected сказал: Интересно, а как он должен выровняться, если он во всю ширину body? Нужно же как-то понять, что он выровнялся, для этого хотя бы установить ширину, например width:90%; Все верно раньше стоял размер в px и все норм было, но я делаю резину (в %), а в процентах он как-то некорректно выравнивает, а именно при 100% ничего не происходит, при меньшем - уменьшает сайт (приближает его к центру, сужая) т.е. #container { margin: 0 auto; width: 100% или 70%; } сужается к центру, но не вравнивает весь сайт по центру Link to comment https://ipbmafia.ru/topic/17342-pochemu-ne-vyravnivaetsya-po-centru/?&do=findComment&comment=128386 Share on other sites Больше вариантов
12 мая, 20177 yr comment_128389 margin: 0 auto; Этим не выровнять весь контент сайта по центру. Для этого используется text-align. Link to comment https://ipbmafia.ru/topic/17342-pochemu-ne-vyravnivaetsya-po-centru/?&do=findComment&comment=128389 Share on other sites Больше вариантов
12 мая, 20177 yr Author comment_128390 4 минуты назад, Respected сказал: margin: 0 auto; Этим не выровнять весь контент сайта по центру. Для этого используется text-align. мне не нужно текст выравнивать(уже проверил) Весь сайт - это блок #container, но он сейчас слева, а должен быть по центру. Link to comment https://ipbmafia.ru/topic/17342-pochemu-ne-vyravnivaetsya-po-centru/?&do=findComment&comment=128390 Share on other sites Больше вариантов
12 мая, 20177 yr comment_128391 Чтобы выровнять объект по центру, нужно задать ему ширину Link to comment https://ipbmafia.ru/topic/17342-pochemu-ne-vyravnivaetsya-po-centru/?&do=findComment&comment=128391 Share on other sites Больше вариантов
12 мая, 20177 yr comment_128392 body { margin: 0; } Link to comment https://ipbmafia.ru/topic/17342-pochemu-ne-vyravnivaetsya-po-centru/?&do=findComment&comment=128392 Share on other sites Больше вариантов
12 мая, 20177 yr Author comment_128393 6 минут назад, Respected сказал: Чтобы выровнять объект по центру, нужно задать ему ширину 4 минуты назад, WOLF сказал: body { margin: 0; } Сайт как был слева так и остался Link to comment https://ipbmafia.ru/topic/17342-pochemu-ne-vyravnivaetsya-po-centru/?&do=findComment&comment=128393 Share on other sites Больше вариантов
12 мая, 20177 yr comment_128399 width: 100%; margin: auto; margin-left: 20%; / Link to comment https://ipbmafia.ru/topic/17342-pochemu-ne-vyravnivaetsya-po-centru/?&do=findComment&comment=128399 Share on other sites Больше вариантов
12 мая, 20177 yr comment_128411 Как можно выровнять блок по центру, если он занимает всю ширину страницы? Мерджином выравнивается твой контейнер, а не его содержимое. Еще какое то извращением с заданием ширины шапки и подгоном нижних блоком под эту ширину. #container { /* margin: auto; */ margin: 0 auto; width: 63%; overflow: hidden; } #header { border: 1px solid black; /* width: 63%; */ height: 193px; background: url(img/shapka_div.jpg); } #bar { float: left; border-left: 1px solid black; border-right: 1px solid black; border-bottom: 1px solid black; background: url(img/bar.jpg); background-size: cover; /*width: 17.3%;*/ width: 35%; height: 600px; box-sizing: border-box; } #main { border-right: 1px solid black; border-bottom: 1px solid black; float: left; border-top: 2px; background: url(img/main.jpg); background-size: cover; /*width: 45.6%;*/ width: 65%; height: 600px; box-sizing: border-box; } Спойлер Link to comment https://ipbmafia.ru/topic/17342-pochemu-ne-vyravnivaetsya-po-centru/?&do=findComment&comment=128411 Share on other sites Больше вариантов
12 мая, 20177 yr comment_128412 Не знаю что там по сложности его впихнуть по центру. Достаточно задать ему ширину, и все стает как надо width: 100%; margin: auto; margin-left: 20%; / Так же можно через обычный отступ вокруг, просто убираем top остальные через %. Не знаю насколько точно будет, но на глаз приемлемо width: 100%; margin:0 18%; Link to comment https://ipbmafia.ru/topic/17342-pochemu-ne-vyravnivaetsya-po-centru/?&do=findComment&comment=128412 Share on other sites Больше вариантов
13 мая, 20177 yr Author comment_128422 @Fateswhisper, спасибо. Link to comment https://ipbmafia.ru/topic/17342-pochemu-ne-vyravnivaetsya-po-centru/?&do=findComment&comment=128422 Share on other sites Больше вариантов
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.