Jekil
-
Posts
7 -
Joined
-
Last visited
Jekil's Achievements
Explorer (1/14)
0
Reputation
-
блин я подозреваю что мое меню можно сделать как-то получше =))) но познаний не хватает т.е. у меня должен быть например <div id="menu"> с POSITION:relative и HEIGHT и внутри него уже все 6 <ul><li></ul></li> рисовать? блин казалось бы чего проще нарисовать чуть ли не одну простенькую страничку, но нет блин решишь одну проблему вылезит другая опять вечер убил на это и что-то никак так завтра на свежую голову после работы подумаю обо всем основательно. Полюбому как всегда все окажется элементарно
-
Спасибо, попробовал сделать свой шаблончик более адаптивным стало значительно получше но терь менюшки в горизонтали остаются на месте но по вертикали разъезжаются и давят на нижний блок и все разъезжается http://test.svobodnye-narody.ru/ чтот никак не понимаю как же сделать толково?
-
действительно я дурак обидно конечно же я пока понятия не имею(точнее не имел) что такое адаптивный веб-дизайн / адаптивная верстка и естественно шаблон делался без учета "адаптивности" на сайте сейчас не этот шаблон но ссылка вот - http://svobodnye-narody.ru/ В общем я вас понял спасибо! Будем изучать html/css дальше =))) ну и вордпресс до кучи
-
Добрый день! Подскажите пожалуйста Делаю простенький шаблончик на вордпресс. Будет выглядеть примерно так но у меня фигня происходит с менюхами при уменьшении размера окна браузера, они съезжают как и див.entry код хедера: и цсс: я нуб во всех этих делах и не понимаю почему так происходит, два дня сидел пробовал менять все что мог. думал дело в position да нифига. Чет понять не могу в чем проблема. Подскажите пожалста, где искать корень проблемы? Как поправить?
-
То что нада думается. Правда пока ничего так и не смог реализовать +) Но это скорей из-за плохого знание предмета, бум учится. Спасибо, интересные ссылки =)
-
Поглядел тему, ответа на свой вопрос не нашел, там фактически обсуждается только как прижать футер к низу(хотя дело тоже нужное=)). Вопросы там на подобие моего задавались, но ответ так на него дан не был. Хотя возможно не внимательно смотрел. Спасибо за ссылку, после работы гляну подробней!
-
В общем я только начинаю учится всему этому, так что чур камни шибко не пинать. Пока делаю простенький сайтик. Значит так на странице у меня один главный блок <div id = "container">(рабочее поле сайта) внутри которого есть <div id = "header">(собсна шапка), <div id = "text">(с основным содержимым сайта, т.е. всякие новости, статьи и тд.), <div id="news"> и <div id="footer">. <div id="news"> расположен справа от <div id = "text"> и он представлен в виде не широкой колонки в которой будут выводится ну предположим краткие новости эта колонка имеет свой фон(ввиде картинки, точнее маленький полупрозрачный одноцветный прямоугольник). Сам вопрос как можно сделать чтоб он тянулся до низу, а не поджимался к тексту(как на картинке)? Думал repeat-y и height 100% решают а не помогает. Буду благодарен за любые подсказки! Прилагаю код хтмл: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang = "ru" xml:lang = "ru"> <head> <meta http-equiv = "Content-Type" content = "text/html; charset=windows-1251" /> <meta name = "description" content = "...бла...бла..." /> <meta name = "keywords" content = "...бла...бла..." /> <link rel = "stylesheet" href="style.css" type = "text/css" /> <title>...бла...бла...</title> </head> <body> <div id = "container"> <div id = "header"> </div> <div id = "nav"> <ul> <li>Главная</li> <li><a href="#">...бла...бла...</a></li> <li><a href="#">...бла...бла...</a></li> <li><a href="#">...бла...бла.../a></li> <li><a href="#">...бла...бла...</a></li> </ul> </div> <div id = "text"> <img class = "img1" src="image/mel.jpg" alt="...бла...бла..." /> <h2>...бла...бла...</h2> <p>...бла...бла...</p> <p>...бла...бла...</p> <img class="venzel" src="image/venzel2.png" alt="...бла...бла..." /> <img class="img2" src="image/image5.jpeg" alt="...бла...бла..." /> <div id="members"> <h2>...бла...бла...:</h2> <ol> <li><a href="#">...бла...бла...</a></li> <li><a href="#">...бла...бла...</a></li> <li><a href="#">...бла...бла...</a></li> <li><a href="#">...бла...бла...</a></li> <li><a href="#">...бла...бла...</a></li> <li><a href="#">...бла...бла...</a></li> </ol> <ol> <li value="7"><a href="#">...бла...бла...</a></li> <li><a href="#">...бла...бла...</a></li> <li><a href="#">...бла...бла...</a></li> <li><a href="#">...бла...бла...</a></li> <li><a href="#">...бла...бла...</a></li> <li><a href="#">...бла...бла...</a></li> </ol> </div> <img class="line" src="image/line.png" alt="" /> </div> <div id="news"> <h3>...бла...бла...:</h3> <ul> <li>...бла...бла...</li> <li>...бла...бла...</li> <li>...бла...бла...</li> </ul> </div> <div class="clearfloat"></div> <div id="footer"> <p>Главная | <a href="#">О нас</a> | <a href="#">...бла...бла...</a> | <a href="#">О ...бла...бла...</a> | <a href="#">...бла...бла...</a> | <a href="#">...бла...бла...</a></p> <p>© MYSITE.RU, 2011 | All right reserved. </p> </div> </div> </body> </html> И CSS *{ margin: 0; padding: 0; border: 0; } body { padding: 2% 0 0; background-color: #ccc; background-image: url("image/bg.jpg"); background-attachment: fixed; color: #333; font-family: "Comic Sans MS", Verdana, Arial, Helvetica, sans-serif; } #container { width: 940px; margin: 0 auto; border: 1px solid #999; } #header { background: url("image/logo.jpg") no-repeat; width: 940px; height: 198px; } #nav { background: url("image/nav-bg.gif") repeat-x right; width: 940px; color: #f00; font-size: 120%; font-weight: bold; line-height: 1.8em; text-align: center; } #nav ul { list-style-type: none; } #nav li { display: inline; margin: 0 8px; } #nav li a { color: #0c0; } #nav li a:hover { color: #f00; } a { text-decoration: none; } #text { background: url("image/fon2.png"); width: 755px; font-size: .8em; font-weight: bold; border: 3px; color: #333; margin: 0px auto; float: left; } #text h2 { color: #f60; font-size: 120%; font-weight: bold; text-align: center; } #text p { text-align: justify; text-indent: 1.5em; margin: 0; padding: 0 15px; } #text a { color: #396; } #text a:hover { color: #f36; border-bottom: #f36 dotted 1px; } .img1 { width: 208px; height: 293px; margin: 5px 5px 0 15px; float: right; } .img2 { width: 400px; height: 300px; margin: 5px 177px 0px 177px; float: none; } .venzel { width: 200px; height: 80px; margin: 0px 277px 0 277px; float: left; } #members { width: 400px; height: 190px; float: left; margin: 5px 0px 0px 177px; } #members h2 { color: #f60; font-size: 120%; font-weight: bold; text-align: center; } #members ol { color: #999; font-size: 120%; margin: 10px 0px 0px 65px; float: left; } #members li { margin: 0 5px; } #members li a { color: #0c0; } #members li a:hover { color: #f00; } .line { width: 198px; height: 198px; float: none; margin: -80px 278px 0 278px; } #news { background: url("image/fon_news.png"); background-repeat: repeat-y; width: 185px; height: 100%; color: #665; margin: 0 0px; float: right; } #news h3 { color: #f60; font-size: 120%; font-weight: bold; text-align: center; } #news ul { list-style: url(image/marker.png) inside; } #news li { font-size: 75%; padding: 5px 10px; } #footer { background : #4d4d4d; color : #fff; font-size : 70%; padding : 5px; clear : both; } #footer a { color : #ff0; } #footer a:hover { color : #f00; } #footer p { padding : 2px; text-align : center; } .clearfloat { clear : both; }