Jump to content

Осенний Дождь

User
 View Profile  See their activity

  • Posts

    39

  • Joined

  • Last visited

 Content Type 

Everything posted by Осенний Дождь

  1. Осенний Дождь
    именно в качестве просмотра результата верстки - дрим для меня никакого веса не имеет, т.к. результат все равно в браузерах просматривать приходится... в качестве именно удобного редактора, к которому привык очень давно, да имеет, т.к. редактируется все в нем, соответственно съехавший дизайн в нем очень неудобно редактировать, да причем редактировать , даже блоки добавлять... Я не верстальщик и им не собираюсь становится, мне удобнее так, визуально... \Верстальщикам видимо удобно в блокноте все прописывать пересохранять тысячу раз, и каждые 3 минуты видеть результат, мне так неудобно, и не только мне но и многим другим рядовым пользователям дрима, а не верстальщикам... понятно, что может быть, с точки зрения правильной верстки, это несколько неправильно... но увы так.. Хотя, опять же, возвращаясь к "правильному" шаблону, пересмотрел не один десяток сайтов с макетами, блогами, где дают каркас "железный", или описывают как его сделать - везде разные мнения/коды/дивы .. поэтому правильную верстку, или точнее макет ее, можно под сомнение поставить...Следовательно и мой макет, имеет общий вес на равне с другими))
  2. Осенний Дождь
    и где тут утверждение, что дрим показатель верстки?)) это редактор, удобный редактор, не более того... непонятно к чему это было написано вообще..про отображение речь не шла)) помимо отличный в 1 див, есть еще преимущества у макета?))
  3. Осенний Дождь
    я разве утверждал где-то обратное?
  4. Осенний Дождь
    не показатель чего, простите?
  5. Осенний Дождь
    )) как бы это не смешно звучало, тот макет, опять-таки в дриме разъезжается))) а с моим всё ок))))
  6. Осенний Дождь
    а стОит ли вообще его делать, раз такой вопрос возникает?
  7. Осенний Дождь
    перед контентом - 5 дивов в моём - тоже 5 ( +1 майнконтейнер общий) чем лучше, тем что на 1 див меньше?
  8. Осенний Дождь
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>3 col layout with equalising columns and footer</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css"> * {margin:0;padding:0} body { padding:10px 0 0 0; color: #000000; background:#fff; text-align:center; } #wrapper{ background:#f2f2f2 url(leftcolbg.jpg) repeat-y left top; width:auto; border:1px solid #000; min-width:770px; max-width:1024px; text-align:left; margin-left:auto; margin-right:auto; position:relative; } #outer{ margin-left:130px; margin-right:130px; background:silver; border-left:1px solid #000; border-right:1px solid #000; color: #000000; } #header{ position:absolute; top:0; left:0; width:100%; height:70px; line-height:70px; border-bottom:1px solid #000; overflow:hidden; color: #fff; background:#f2f2f2 url(images/blogphoto.jpg) repeat-x left top; text-align:center; font-size:xx-large } #left { position:relative;/*ie needs this to show float */ width:130px; float:left; margin-left:-129px;/*must be 1px less than width otherwise won't push footer down */ left:-1px } * html #left {margin-right:-3px;}/* 3px jog*/ * html #outer{/* 3px jog*/ margin-left:127px; margin-right:127px; } p {margin-bottom:1em;padding:0 5px} #right { position:relative;/*ie needs this to show float */ width:130px; float:right; margin-right:-129px;/*must be 1px less than width otherwise won't push footer down */ left:1px; } * html #right {margin-right:-130px;margin-left:-3px}/* stop float drop in ie + 3px jog */ #footer { width:100%; clear:both; line-height:50px; border-top:1px solid #000; background-color:#ffffcc; color: #000000; text-align:center; position:relative; } #clearheader{height:72px;}/*needed to make room for header*/ #centrecontent {float:right;width:99%;position:relative;} * html #centercontent{width:100%} .outerwrap { float: left; width: 99%; } .clearer{ height:1px; overflow:hidden; margin-top:-1px; clear:both; } </style> <!--[if lt IE 7]> <style type="text/css"> body {width:expression( documentElement.clientWidth < 770 ? (documentElement.clientWidth == 0 ? (body.clientWidth < 770 ? "770" : "auto") : "770px") : "auto" );} #wrapper {width:expression( documentElement.clientWidth > 1024 ? (documentElement.clientWidth == 0 ? (body.clientWidth >1024 ? "1024" : "auto") : "1024px") : "auto" );} * html #outer, * html #wrapper,* html #centrecontent {height:1%} </style> <![endif]--> </head> <body> <div id="wrapper"> <div id="outer"> <div id="clearheader"></div> <div class="outerwrap"> <div id="centrecontent"> <h1>Min width of 800px and max width of 1024px</h1> <p>centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here centre content goes here : centre content goes here content goes here : </p> </div> <div id="left"> <p>Left content goes here : Left content goes here : Left content goes here : Left content goes here : Left content goes here : Left content goes goes here : Left content goes here : </p> </div> <div class="clearer"></div> </div> <!--end outer wrap --> <div id="right"> <p>Start Right content goes here : Right content goes here : Right content goes here : Right content goes here : Right content goes here : Right content goes here : Right content goes here : Right content goes here : Right content goes here : </p> </div> <div class="clearer"></div> </div> <div id="footer"><a href="3colfixedtest_4.htm">Back to main Demo</a></div> <div id="header">Header </div> </div> </body> </html> ага вижу, ну , этот макет по-твоему лучше? такая же вложнность, куча кода.. плюс еще с "position:.;" которая в некоторых браузерах подглючивает
  9. Осенний Дождь
    там нет подходящих, контент не вверху, принцип вроде тот же, особой разницы не увидел... psywalker гуру одобрил, а это главное
  10. Осенний Дождь
    а причем тут дрим.. это скрин не с дрима - а с браузера же.. спасибо, вроде размеры сам подогнал, всё четко получилось.. окромя верхнего меню, оно в IE7 съезжает немного... А так в целом, сам каркас Вам как? (P.S. это макет не дримовский, а взятый с совершенно другого сайта )
  11. Осенний Дождь
    шаблоны, как раз-таки, большинство там вполне нормально отображаются. а вот макеты увы.. просто так удобный редактор, в коде неудобно редактировать...каждые 10 секунд смотря в браузере что изменилось..
  12. Осенний Дождь
    ну вот чтобы именно в редакторе норм отображалось для меня и критично.. Глючит там именно из-за отрицательных значений.. Дримовские встроенные шаблоны - да, юзал, но там подходящего не нашлось! а по поводу ссылки - уже облазал кучу таких сайтов-генераторов везде криво. ТОлько 1 сайт нашел на котором шаблоны корректно работают в дриме...
  13. Осенний Дождь
    1) вот именно с этим возникают сложности: Когда подгоняю в опере и мозиле норм более менее, а в ие вообще съезжает... 2) ДА! ==>3) И чтобы он в dreamweaver нормально был виден, перебрал несколько десятков шабов, - и этот подошел идеально)) Заранее спасибо!
  14. Осенний Дождь
    нашел я всё-таки макет подходящий, он почти идеален единственная проблема, никак не могу подогнать точные размеры, блоки периодически уплывают... <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>Three column CSS layout: 100% height with footer | Savio.no</title> <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" /> <style type="text/css"> /* CSS-file for three column layout 2006 Developed by Eivind Savio */ * /*Set's border, padding and margin to 0 for all values*/ { padding: 0; margin: 0; border: 0; } body, html { color: #000; font-family: Verdana, Arial, Tahoma, sans-serif; background-color: #222222; text-align: center; /*** Centers the design in old IE versions ***/ height: 100%; } body { font-size: 70%; } p {padding: 7px 0 7px 0;} a { color: #06F; } a:hover{ color: #0000FF; text-decoration: none; } h1, h2, h3 { font-weight: bold; padding-bottom: 5px; } h1 { font-size: 2em; } h2 { font-size: 1.4em; } h3 { font-size: 1.3em; } .clear { clear: both; } #mainContainer { width: 1000px;/*** 760 ***/ margin: 0 auto; /*** Centers the design ***/ min-height: 100%; background: #ffffff url(/examples/three-column-100-bg.gif) repeat-y; /*** This is our faux columns ***/ text-align: left; /*** Because we centered the text in body we have to move the text back to left aligning ***/ } * html #mainContainer { height: 100%; /*** IE doesn't support min-height, but instead it handles height as min-height so we need to hack the height ***/ } /************************** HEADER **************************/ #header { background: #000099; padding: 10px; background-image:url(img/galaxy.jpg); height:300px; } #menu { background: #111111; padding: 3px; height: 20px; text-align:center; margin: 0; } #menu a { color:#CCC; text-decoration:none; } #menu a:hover { color: #EDF; text-decoration: underline; } /************************** CONTENT AND COLUMNS **************************/ .outer { padding-left: 165px; } * html .outer { padding-right: 120px; /* Normally this shouldn't be in this hack, it should be in .outer, but because of IE7 I had to */ } .inner { width: 850px; /*** 595 This width is for non-IE browsers. Mozilla makes this necessary. Be sure to check your layout in different browsers if you changes this value. Especially IE7 seems to create a horisontal scroll if this value is set too large ***/ padding-bottom: 30px; } * html .inner { width: 100%; } /*** div.inner is wider than its container, div.outer, and so overlaps to the right, pushing div.right into the proper position. IE expands div.outer instead, requiring a Tan hack to avoid blowing the layout apart. IE gets the original 100% width as in the Livingstone layout. ***/ .float-wrap { float: left; width: 770px; margin-left: -165px; /*** -165 Same length as .outer padding-left but with negative value ***/ } * html .float-wrap { /*** No need for hacking IE on this layout ***/ } #content { float: right; width: 500px; background: #fff; } * html #content { position: relative; /*** IE needs this ***/ } .contentWrap{ padding: 5px; } .contentWrap ol, .contentWrap ul { margin: 3px 0 5px 35px; } .contentWrap li { padding-bottom: 2px; } /************************** LEFT COLUMN **************************/ /*** div.left is in div.float-wrap, and when div.float-wrap is neg margined to the left, div.left is carried over into the proper position. ***/ #left { float: left; width: 200px;/*** 165***/ padding: 5px; } * html #left { position: relative; /*** IE needs this ***/ } #left ul { list-style: none; padding-bottom: 4px; } #left li { padding-bottom: 2px; } /************************* RIGHT COLUMN **************************/ #right { float: right; width: 200px; padding: 5px; } * html #right { position: relative; /*** IE needs this ***/ margin-right: -120px; /*** IE gets this margin. ***/ } #right ul { list-style: none; padding-bottom: 4px; } #right li { padding-bottom: 2px; } /************************** FOOTER **************************/ #footer { width: 1000px;/*** 760 ***/ height: 30px; /*** The drawback with this solution is that the height of the footer can't be flexible. If you add so much content to the footer that it extends 30px, you will get a vertical scrollbar and the content will overflow the footer if you don't set overflow to hidden ***/ margin: 0 auto; margin-top: -30px; /*** By using a negative margin-top we now moves the footer up the same amount as the footer height to avoid vertical scrolling. Remember, if you use borders and padding on your footer you will have to calculate this in your negative margin-top value also. ***/ text-align: center; background-color: yellow; } /* Green Box */ .gbox { } .gbox .heading { height: 27px; padding: 4px 0 0 10px; /*отступ заголовка*/ background: url(images/m-izumrud.gif) no-repeat; letter-spacing: -1px; font-size: 1.4em; color: #09881C; margin:0;/*отступ меж дивами стал 0)*/ } .gbox .content { padding-top:inherit; padding: 10px; background: url(images/img07.gif) no-repeat; } .gbox ul { margin: 0; padding: 0; list-style: none; } .gbox li { padding-left: 15px; background: url(images/img08.gif) no-repeat left center; } .gbox a { color: #09881C; text-decoration:none; } .gbox a:hover { text-decoration:underline; } /* —-Orange Box —-*/ .obox { } .obox .heading { height: 27px; padding: 4px 0 0 10px; background: url(images/img03.gif) no-repeat; letter-spacing: -1px; font-size: 1.4em; color: #FF6500; margin:0;/*отступ меж дивами стал 0)*/ } .obox .content { padding: 10px; background: url(images/img04.gif) no-repeat; } .obox ul { margin: 0; padding: 0; list-style: none; } .obox li { padding-left: 15px; background: url(images/img05.gif) no-repeat left center; } .obox a { color: #FF6500; } /*новости*/ .news-zag { height: 30px; padding: 8px 0 0 10px; background: url(images/img09.gif) no-repeat; font-size: 1.4em; } .note { background:#DCDCDC none repeat scroll 0 0; border:1px solid #B4B4B4; } .lbl { background: #222 url(images/bglbl.gif) repeat-x; float:left; color: #FFF; font: normal 1.4em "Lucida Sans Unicode",sans-serif; height: 17px; line-height: 20px; overflow: hidden; text-align: center; margin-left: 3px; padding: 3px; text-align:center; } </style> <!-- DO NOT copy - this is analytics codes for Savio.no! --> <!-- END - DO NOT copy - this is analytics codes for Savio.no! --> </head> <body> <div id="mainContainer"> <div id="header"> <h1> </h1> <h2>666</h2> </div> <div id="menu"> <div class="lbl"><a href="#">Главная</a></div> <div class="lbl"><a href="#">555/a></div> <div class="lbl"><a href="#">33333 </a></div> <div class="lbl"><a href="#">Новости</a></div> <div class="lbl"><a href="#">Форум</a></div> <div class="lbl"><a href="#">К111</a></div> <div class="lbl"><a href="#">Интервью</a></div> <div class="lbl"><a href="#">Конкурсы</a></div> <div class="lbl"><a href="#">Фишки</a></div> <div class="lbl"><a href="#">1</a></div> </div> <div class="outer"> <div class="inner"> <div class="float-wrap"> <div id="content"> <div class="contentWrap"> <h2>text text text text text text text text text text text text text text text text text text text text text text text text gfgfg</h2> <h1>fffgdfgfdgd</h1> <div class="news-zag">новостч:</div> <div class="note">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio.</div> </div> </div> <!-- end centered div --> <div id="left"> <h3>Second in source</h3> <ul> <li><a href="#">Left menu 1</a></li> <li><a href="#">Left menu 2</a></li> <li><a href="#">Left menu 3</a></li> </ul> <p>wwwww</p> <!--оранж блок!--> <div class="obox"> <h2 class="heading">Меню сайта</h2> <div class="content"> <ul> <li><a href="#">February</a> (7) </li> <li><a href="#">January 2007</a> (31)</li> <li><a href="#">December 2006</a> (31)</li> <li><a href="#">November 2006</a> (30)</li> </ul> </div> </div> <!--оранж блок!--> <div class="obox"> <h2 class="heading">Все Статьи о Galaxy:</h2> <div class="content"> <ul> <li><a href="#">February</a> (7) </li> <li><a href="#">January 2007</a> (31)</li> <li><a href="#">December 2006</a> (31)</li> <li><a href="#">November 2006</a> (30)</li> </ul> </div> </div> <!--оранж блок!--> <div class="obox"> <h2 class="heading">События</h2> <div class="content"> <ul> <li><a href="#">February</a> (7) </li> <li><a href="#">January 2007</a> (31)</li> <li><a href="#">December 2006</a> (31)</li> <li><a href="#">November 2006</a> (30)</li> </ul> </div> </div> <!--оранж блок!--> <div class="obox"> <h2 class="heading">Archives</h2> <div class="content"> <ul> <li><a href="#">February</a> (7) </li> <li><a href="#">January 2007</a> (31)</li> <li><a href="#">December 2006</a> (31)</li> <li><a href="#">November 2006</a> (30)</li> </ul> </div> </div> </div> <!-- end left div --> <div class="clear"></div> </div> <div id="right"> <h3>Third in source</h3> <!--оранж блок!--> <div class="obox"> <h2 class="heading">Archives</h2> <div class="content"> <ul> <li><a href="#">February</a> (7) </li> <li><a href="#">January 2007</a> (31)</li> <li><a href="#">December 2006</a> (31)</li> <li><a href="#">November 2006</a> (30)</li> </ul> </div> </div> <!--Гринблок--> <div class="gbox"> <h2 class="heading">К555</h2> <div class="content"> <ul> <li><a href="#">My Blog</a></li> <li><a href="#">My Photos</a></li> <li><a href="#">My Favorites</a></li> <li><a href="#">About Me</a></li> <li><a href="#">Contact Me</a></li> </ul> </div> <h2 class="heading">222h2> <div class="content"> <ul> <li><a href="#">My Blog</a></li> <li><a href="#">My Photos</a></li> <li><a href="#">My Favorites</a></li> <li><a href="#">About Me</a></li> <li><a href="#">Contact Me</a></li> </ul> </div> <h2 class="heading">34333</h2> <div class="content"> <ul> <li><a href="#">My Blog</a></li> <li><a href="#">My Photos</a></li> <li><a href="#">My Favorites</a></li> <li><a href="#">About Me</a></li> <li><a href="#">Contact Me</a></li> </ul> </div> <h2 class="heading">333</h2> <div class="content"> <ul> <li><a href="#">My Blog</a></li> <li><a href="#">My Photos</a></li> <li><a href="#">My Favorites</a></li> <li><a href="#">About Me</a></li> <li><a href="#">Contact Me</a></li> </ul> </div> <h2 class="heading">Кланы</h2> <div class="content"> <ul> <li><a href="#">My Blog</a></li> <li><a href="#">My Photos</a></li> <li><a href="#">My Favorites</a></li> <li><a href="#">About Me</a></li> <li><a href="#">Contact Me</a></li> </ul> </div> <h2 class="heading">222</h2> <div class="content"> <ul> <li><a href="#">My Blog</a></li> <li><a href="#">My Photos</a></li> <li><a href="#">My Favorites</a></li> <li><a href="#">About Me</a></li> <li><a href="#">Contact Me</a></li> </ul> </div> </div> </div> <!-- end right div --> <div class="clear"></div> </div> </div> </div> <div id="footer"><p>This is our footer</p> </div> </body> </html> хотел чтобы центр немного пошире стал, т.к. отступы слева и справа большие получаются... уже несколько часов firebug туда сюда пробую тестирую, только нормально получается, как в ие 6 всё уезжает блинн .outer {padding-left: 165px; .inner {width: 850px; .float-wrap { width: 770px; подскажите пожалуйста, как точные размеры подобрать? пробовал суммарно складывать просчитывать, но все равно не так как нужно выходит.. #content {width: 500px;
  15. Осенний Дождь
    ну.."заготовка" о вашем ) дрим не причем, просто редактирую в нем, и сотня других не подошла из-за глючности отрицательных полей, все криво отображается, а ваш чётко отображается
  16. Осенний Дождь
    psywalker огромное спасибо! отличный слой.. и в "дриме" не глючит...если не секрет, откуда он?
  17. Осенний Дождь
    тут был код!
  18. Осенний Дождь
    не получается так, съезжает... в таком случае визуально получается: слева контент , в центре сайдбар1, справа сайдбар а нужно чтобы визуально было: слева сайдбар1... в центре контент, справа сайдбар2.
  19. Осенний Дождь
    подскажите пожалуйста: sidebar1 {float:left; width: 180px; background: #EADCAE; padding-bottom: 10px;} .content {float:left; padding: 10px 0; width: 600px;} .sidebar2 { width: 180px; background: #EADCAE; padding: 10px 0; margin-left: 780px;} <div class="content"></div> <div class="sidebar1"></div> <div class="sidebar2"></div> Как сделать так, чтобы все три дива на одном уровне располагались? Визуально: слева сайдбар1... в центре контент, справа сайдбар2. Не меняя очередности расположения самих дивов, чтобы <div class="content"></div> впереди в коде шел
  20. Осенний Дождь
    Там шаблон движка, 14 файлов ксс, как его выложить?...
  21. Осенний Дождь
    Подскажите плиз, какое свойство у ol, ul, li, отвечает за перенос строки? Что-то изменил в шаблоне, и теперь когда идет элемент списка в меню <ul> <li> </li> </ul> То пункт меню с новой строчки не начинается, а сливается все в одну строчку. и точки тоже сливаются, которые должны с новой строки появляться скрин
  22. Осенний Дождь
    это просто пример был, там по сути - цвет разный нужен и рамку другую сделать... они там на каждой странице чуть другие
  23. Осенний Дождь
    спасибо, но в чем разница то? только в имени? если по сути тоже самое, только тут имена другие... или в div.navigation1.navigation2{} нужно будет только прописать изменяемый элемент, и все, а остальное он у div.navigation1 {} возьмет?
  24. Осенний Дождь
    ну вот например :} div#navigation{float:right;width:195px; border-top: 2px dotted black; border-bottom: 2px dotted black; border-left: 2px dotted black; border-right: 2px dotted black;} вот на каждой странице, нужно чтобы этот элемент имел разные размеры.. а таких страниц 10, скажем.. получится если все в 1 файл придется писать div#navigation1{float:right;width:195px; div#navigation2{float:right;width:195px; div#navigation3{float:right;width:195px; div#navigation4{float:right;width:195px;
  25. Осенний Дождь
    как правильно делают если на сайте, на каждой странице, много разных элементов, класcов, id? 1 Класс на разных страницах должен иметь разные свойства цвет и т..д. 1)Выносить со всех страниц в отдельный файл, (он получится большой) 2)Писать в коде страницы индивидуальный css на каждой странице.. 3)Выносить на каждой странице в разные файлы... подскажите пожалуйста
×
×
  • 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

  I accept