|
Помогите с версткойОбсуждение темы Помогите с версткой в разделе HTML, CSS, JavaScript, часть категории ВЕБ-ПРОГРАММИРОВАНИЕ; Это мой первый опыт подобного начинания, так что критика принимается!При верстке в дриме вроде все ровненько выходит, но стоит открыть в браузере верстка ... |
|
Опции темы |
14.06.2015, 18:52 | #1 |
|
Это мой первый опыт подобного начинания, так что критика принимается!При верстке в дриме вроде все ровненько выходит, но стоит открыть в браузере верстка начинает плыть( Все что нагуглил не помогло или руки кривые... Задача стоит выровнять менюшку и <article> по горизонту. Ссылка на исходники:https://yadi.sk/d/lKfZmE87hFAcD
собственно CSS: html{ background-image: url(\images/blue_fon2.png); background-size: 100%; background-repeat: no-repeat; background-attachment: fixed; width:auto; max-width:1600px; min-width:900px; } body{ width: auto; height: auto; max-width: 1600; min-width: 900; } .it assist{ height: 0px; clear: both; float: left; } /*TOP AREA*/ .top_area { width: auto; height: 200px; max-width: 1600px; min-width: 900px; } .logotype { float: left; height: 110px; width: 400px; } .contacts { float: right; font-size: 20px; position: relative; visibility: visible; list-style: none; } .contacts b{ color: #009; } /*Index slider start*/ .slider_wrap { width: 40%; height: 70%; position: relative; overflow: visible; visibility: visible; display: inline-block; background-color: #000; margin-left: 50px; } .slider_wrap img { width:100%; height:100%; display: none; position: absolute; top: 0; } .slider_wrap img:first-child { display:block; } .slider_wrap span { margin-top:-13px; width:15px; height:26px; display:block; position:absolute; top:50%; cursorointer; } .slider_wrap span.next:hover { } .slider_wrap span.prev:hover { } /*Index slider end*/ div.menu { width: auto; height: 60px; position: relative; max-width: 1200px; min-width: 900px; margin: 0 auto; left: 50%; } ul.menu { font-size: 26px; font-family: "Comic Sans MS", cursive; height: auto; width: auto; background-color: #96C; margin: 0 auto; max-width: 1200px; min-width: 900px; right: 50%; position: relative; } ul.menu li { float: left; list-style: none; background-color: #939; margin-left: -15px; padding-right: 35px; padding-left: 60px; } ul.menu li a { color: #FF0; text-decoration: none; text-shadow: 1px 0px #FC0; font-style: normal; } ul.menu li a:hover { color: #000; } ul.menu li ul { display: none; background-color: #96C; margin-left: -60px; } ul.menu li:hover ul { display: block; position: absolute; } ul.menu li:hover ul li { float: none; } ul.menu ul li { background-color: #96C; } ul.menu ul li:hover { } ul.menu ul li a { color: #FF0; } ul.menu ul li a:hover { color: #000; } ul.menu li:hover ul li a { } /*ARTICLE*/ section.text_area{ width: 74%; font-size: 20px; margin: 0 auto; font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif; font-style: normal; color: #000; font-variant: small-caps; font-weight: normal; border: 1px solid; border-color: #FF0; margin-top: 50px; background-color: #0CF; min-width: 900px; max-width: 1200px; text-align: center; } #image{ width: auto; height: auto; clear: both; float: none; min-width: 80%; max-width: 80%; margin: 0 auto; padding-top: 50px; padding-left: 90px; } .image{ border: 1px solid; border-color: #FF0; border-radius: 10px; display: block; float: left; } .image_content { width: 300px; height: 200px; float: left; padding-bottom: 30px; } .subtext{ width: 30%; height: 200px; float: left; padding-right: 55px; padding-left: 25px; } .text_area span{ color: #FF0; font-style: normal; text-decoration: underline; text-shadow: 1px 1px #000; text-transform: uppercase; } /*FOOTTER*/ #credits { margin: 20px 0 40px; padding: 10px 0 0; color: #000; font-size: 0.9em; border: 2px; border-top-color: #CF0; border-top-style: solid; font-style: italic; float: left; width: 100%; } .id asist { width: 0px; } |
|
15.06.2015, 13:09 | #2 |
|
привет! я посмотрел твою работу. у меня на всех браузерах кроме IE7, выгладить так https://yadi.sk/d/HmkUZ-T0hFp5e
|
|
15.06.2015, 16:04 | #3 |
|
как то у тебя все крепко запутанно, юзайн notepad какой нибудь типа Sublime и тд
нет ничего проще чем выровнять два div-а по центру... не знаю в чем там проблема width:100px; margin: 0 auto; или один див width:100%; text-align:center; внутренний width:1000px; display:inline-block; или intine а у тебя с этим дримом такая каша, просто вилы |
|
Этот пользователь сказал спасибо Hispanic за это полезное сообщение: | moby dik (16.06.2015) |
16.06.2015, 11:36 | #4 |
|
спасибо
|
|
|
Похожие темы | ||||
Тема | Автор | Раздел | Ответов | Последнее сообщение |
Ребята помогите с версткой! | Mixongur | HTML, CSS, JavaScript | 8 | 29.12.2015 04:26 |
Проблема с версткой | volFernion | HTML, CSS, JavaScript | 12 | 08.06.2010 05:21 |
Помогите, пожалуйста, с версткой сайта | Dimitry | HTML, CSS, JavaScript | 2 | 24.04.2010 19:18 |
Помогите пожалуйста разобраться с версткой | taylerx | HTML, CSS, JavaScript | 4 | 09.10.2009 16:54 |
Помогите мне с версткой разобраться | Scorp | HTML, CSS, JavaScript | 12 | 04.10.2009 17:35 |
Реклама на форуме
Условия размещения рекламы
Биржа ссылок
Заработай на сайте!
|