Jump to content

Alexandrm

Newbie
  • Posts

    8
  • Joined

  • Last visited

Alexandrm's Achievements

Explorer

Explorer (1/14)

0

Reputation

  1. Пользуюсь http://hostinger.com.ua/ есть еще http://hostinger.ru/ Бесплатные, 2гига места. без рекламы. Удобно добавлять их домены (единственное что слышал в яндексе они не индексируются, но для тестов мне и не надо.)
  2. воспользуйся http://csstemplater.com/ . А потом отредактируй под себя.
  3. Появилась такая проблема. Если в шаблоне присутствует * { margin: 0; padding: 0; } то не работают такие стили оформления как маркированный список и подобные (возможно и другие) если убрать код то все работает но появляются отступы по умолчанию. Что надо прописать в коде чтоб заработало?
  4. Про то что паддинг увеличивает ширину блока не знал, считал что паддинг уменьшает область от заданных размеров.
  5. #centercol {background:#8ee; width: 660px; padding:10px 10px 10px 10px; margin: 0 150px 0 150px; font-size: .9em; } #leftcol {background:#3df; width: 150px; padding:10px 10px 10px 10px; margin: 0 0 0 0; float: left; font-size: .9em; } #rightcol {background:#d89; width: 150px; padding:10px 10px 10px 10px; margin: 0 0 0 0; float: right; font-size: .9em; }
  6. Да видать что про то что они обтекают элементы находящиеся по коду ниже пропустил ) Так теперь добавил всем колонкам внутриний отступ 10пх, но на центральной колонке левый отступ не работает. Может я неправильно формирую блоки? Подскажите как надо.
  7. Супер а я второй день мучаюсь . Спасибо. И если можно маленький ликбез почему так?
  8. Помогите настроить шаблон. Пытаюсь поправить шаблон под себе, но не могу разобраться в позиционировании. Код index <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <meta name="author" content="Luka Cvrk (www.solucija.com)" /> <link rel="stylesheet" href="css/main.css" type="text/css" /> <title>minimalistica</title> </head> <body> <div id="content"> <h1>minimalistica</h1> <ul id="menu"> <li><a href="#">home</a></li> <li><a href="#">archive</a></li> <li><a href="#">contact</a></li> </ul> <div class="post"> <div class="details"> <h2><a href="#">Nunc commodo euismod massa quis vestibulum</a></h2> <p class="info">posted 3 hours ago in <a href="#">general</a></p> </div> <div class="body"> <p>Nunc eget nunc libero. Nunc commodo euismod massa quis vestibulum. Proin mi nibh, dignissim a pellentesque at, ultricies sit amet sapien. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque vel lorem eu libero laoreet facilisis. Aenean placerat, ligula quis placerat iaculis, mi magna luctus nibh, adipiscing pretium erat neque vitae augue. Quisque consectetur odio ut sem semper commodo. Maecenas iaculis leo a ligula euismod condimentum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Ut enim risus, rhoncus sit amet ultricies vel, aliquet ut dolor. Duis iaculis urna vel massa ultricies suscipit. Phasellus diam sapien, fermentum a eleifend non, luctus non augue. Quisque scelerisque purus quis eros sollicitudin gravida. Aliquam erat volutpat. Donec a sem consequat tortor posuere dignissim sit amet at ipsum.</p> </div> <div class="x"></div> </div> <div id="leftcol"> <h3><a href="#">Ut enim risus rhoncus</a></h3> <p>Quisque consectetur odio ut sem semper commodo. Maecenas iaculis leo a ligula euismod condimentum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Ut enim risus, rhoncus sit amet ultricies vel, aliquet ut dolor. Duis iaculis urna vel massa ultricies suscipit. Phasellus diam sapien, fermentum a eleifend non, luctus non augue. Quisque scelerisque purus quis eros sollicitudin gravida. Aliquam erat volutpat. Donec a sem consequat tortor posuere dignissim sit amet at.</p> <p>¬ <a href="#">read more</a></p> </div> <div id="centercol"> <h3><a href="#">Maecenas iaculis leo</a></h3> <p>Quisque consectetur odio ut sem semper commodo. Maecenas iaculis leo a ligula euismod condimentum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Ut enim risus, rhoncus sit amet ultricies vel, aliquet ut dolor. Duis iaculis urna vel massa ultricies suscipit. Phasellus diam sapien, fermentum a eleifend non, luctus non augue. Quisque scelerisque purus quis eros sollicitudin gravida. Aliquam erat volutpat. Donec a sem consequat tortor posuere dignissim sit amet at.</p> <p>¬ <a href="#">read more</a></p> </div> <div id="rightcol"> <h3><a href="#">Quisque consectetur odio</a></h3> <p>Quisque consectetur odio ut sem semper commodo. Maecenas iaculis leo a ligula euismod condimentum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Ut enim risus, rhoncus sit amet ultricies vel, aliquet ut dolor. Duis iaculis urna vel massa ultricies suscipit. Phasellus diam sapien, fermentum a eleifend non, luctus non augue. Quisque scelerisque purus quis eros sollicitudin gravida. Aliquam erat volutpat. Donec a sem consequat tortor posuere dignissim sit amet at.</p> <p>¬ <a href="#">read more</a></p> </div> <div id="footer"> <p>Copyright © <em>minimalistica</em> · Design: Luka Cvrk, <a href="http://www.solucija.com/" title="Free CSS Templates">Solucija</a></p> </div> </div> </body> </html> и css код *{margin:0;padding:0;} body { font: .9em Georgia, "Times New Roman", Serif; background: #fff; color: #777;} a { color: #D40000; text-decoration: none; } a:hover { color: #8F0000; } p { line-height: 1.7em; margin: 0 0 15 px; } .x { clear: both; } h1 { float: left; font-size: 2em; font-weight: normal; font-style: italic; padding: 0 0 15px 10px; margin: 0 0 10px; } h2 { font-weight: normal; font-size: 1.5em; padding: 0 0 10px; margin: 0 0 15px; } h3 { font-size: 1.7em; font-weight: normal; margin: 0 0 20px; } h3 a { color: #222; } #content { width: 960px; margin: 20px auto;} #menu { float: right; margin: 10px 20px 0 0; } #menu li { display: inline; list-style: none; } #menu li a { float: left; margin: 0 0 0 10px; color: #888; } #menu li a:hover { color: #555; } .post { clear: both; padding: 10px 10px; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; margin: 0 0 5px; } .post .details { float: left; width: 270px; } .post .details .info { font-size: .9em; color: #999; } .post .details .info a { color: #777; border-bottom: 1px dotted #999; padding: 3px 1px; } .post .body { float: right; width: 625px; padding: 0 10px 0 20px; border-left: 1px solid #ddd; } #centercol {background:#8ee; width: 660px; padding: 0 0 0 0; margin: 0 150px 0 150px; font-size: .9em; } #leftcol {background:#3df; width: 150px; padding: 0 0 0 0; margin: 0 0 0 0; float: left; font-size: .9em; } #rightcol {background:#d89; width: 150px; padding: 0 0 0 0; margin: 0 0 0 0; float: right; font-size: .9em; } #footer { clear: both; padding: 5px 0; font-size: .9em; color: #999; border-top: 1px solid #ddd;} получается что правая колонка становится по нижнему краю центральной колонки. Подскажите как выставить правую колонку поверху.
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy