Search the Community
Showing results for tags 'блоки'.
Found 8 results
-
Бесплатный VPN - FineVPN.org | Telegram бот c бесплатным VPN - @FineVPNbot
Без ограничений по скорости, трафику и времени. Совершенно бесплатный и безлимитный. -
Проблема в следующем верстаю макет с PSD шаблона. Использую HTML и CSS. Прописал по порядку блоки Header. nav. main. в коде html. Добавил картинку и ссылки в блок header. открыл браузер что бы отобразить результат. и вижу. что блок main наехал на блок header. Вопрос: почему так получилось. Ведь одно из свойств блочных тегов - они начинаются с новой строки и занимают всю доступную ширину. (main. игнорирует свойство и не начинается с новой строки). как решить и почему произошло? Заранее благодарю всех за помощь Скрин прикрепляю. HTML <body> <header> <div class="logo"> <img src="..\matereal\images\logo.png" alt="logotip" class="logo__img"> </div> <nav> <a href="" class="nav" >home</a> <a href="" class="nav" >compane</a> <a href="" class="nav" >servise</a> <a href="" class="nav" >clients</a> <a href="" class="nav" >contacts</a> </nav> </header> <main> <div> <img src="" class="slaider" alt="slaider"> <p class="slaider__text__h1">веб-разработке\практика</p> <p class="slaider__text__h2"></p> </div> </main> <footer> </footer> CSS body { margin: 0; } header { margin: 0; border-top: 3px solid black; } .logo { margin:60,0,60,60; float: left; width: 49%; } nav { float: right; margin: 60,60,60,0; width: 51%; }
-
Собрал три блока в виде геометрических фигур - сверху и снизу треугольники в середине параллелогамм. И составил их в столбец, обернув все в общий блок. <div class="d4"> <div class="d1"></div> <div class="d5"></div> <div class="d3"></div> </div> Но в результате получилось, что расстояния между ними большие. Как состывать их вместе, нужно практически вплотную, максимум с отступом в 10 px. Использование padding и margin к желаемому результату не привело. Код CCS такой Треугольник сверху width: 0; height: 0; border-top: 100px solid #68B8AE; border-right:425px solid transparent; display:inline-block; margin-top:600px; параллелогамм -moz-transform: rotate(76deg) skew(7deg, 15deg); -webkit-transform: rotate(76deg) skew(7deg, 15deg); -o-transform: rotate(76deg) skew(7deg, 15deg); -ms-transform: rotate(76deg) skew(7deg, 15deg); transform: rotate(76deg) skew(7deg, 15deg); width:250px; height:450px; border:4px solid #8B0000; background:#7FFF00; margin-left:86px; треугольник снизу width: 0; height: 0; border-bottom: 100px solid red ; border-left: 425px solid transparent; margin-bottom:700px; display:inline-block; }
-
Здравствуйте! Простите, если не сюда пишу. Только начинаю изучать HTML и CSS. Сверстал страницу, на которой присутствуют шапка, футер, меню. Страница трехколоночная. Сайт планирую делать многостраничным. Теперь задался вопросом: Как разместить основные блоки сайта на всех страницах? Имею в виду: футер, шапку, боковые колонки. Не размещать же их на каждой странице. Имею в виду, если кликнуть на ссылку в меню, то открывается новая страница без меню, футера и т.д. Как сделать, чтобы эти основные блоки отображались во всех страницах. Буду рад советам! По форуму искал и читал, но не смог применить некоторые наброски к своему сайту. Так понимаю, необходимо какие-то скрипты подключить? Сайт на PHP не хотелось бы писать. Еще не дорос до него Прикрепляю файлы, что сделано. index.html style.css
-
Добрый вечер, уважаемые форумчане. Я пишу с нуля свой первый сайт и у меня на этапе верстки возникла проблема с размещением меню, что вкладывается в блок header. При масштабировании страницы, меню меняет свои значения: либо оно вылазит за пределы блока-родителя, либо не доходит до его границ (появляются неприятные белые полосы). Возникает вопрос, как зафиксировать меню так, чтобы масштабирование не меняло расположение его блоков? + при масштабе в 100% приходится использовать не целочисленное значения в отступах nav ul li a {padding:41.6px 50px;} для того, чтобы избавиться от белой линии под блоком (методом подгона). Хочется понять, как можно "вылечить" и этот дефект. Раз высота шрифта 15px, а высота блока header 100px, то отступы сверху-снизу должны быть (100-15)/2=42.5. Откуда тогда берется 41.6 не совсем понятно. Прикладываю скриншот https://yadi.sk/i/HOGOClqb3Gmy2k с описанием для лучшего понимания ситуации, а сам код прикрепил к сервису codepen: С уважением, Евгений.
-
Помогите советом. Как склеить два элемента? код нижнего: .underhead { background: #ededed; padding: 35px 0 22px 50px; } .underhead li { float: left; padding: 12px 0 12px 90px; } .underhead h3 { font-size: 15px; color: #575757; } .underhead:auto { content: ''; display: table; clear: both; } Скриншот приложил. Заранее спасибо
-
Нужно чтобы блоки стояли так: Сейчас блоки стоят так: Подскажите, пожалуйста, как выронить блоки, чтобы они стояли ровно? Код: #content {margin-left: 270px;padding: 10px;background: #f0f0f0;height: 900px;}.cat {height: 190px;width: 340px;float: left;padding: 1px;margin-top: 20px;margin-left: 20px;text-align: left;border: 1px solid #8fa09b;background: #ffffff;}—-<div id="content"><div class="cat"></div><div class="cat"></div><div class="cat"></div><div class="cat"></div></div>
-
Всем привет! Подскажите, пожалуйста, почему может не работать float или display:inline-block? Т.е. они как бы работают. Верхние и нижние границы между элементами схлопываются, но по горизонтали не выстраиваются.
