Jump to content

solovets-denis

Newbie
 View Profile  See their activity

  • Posts

    27

  • Joined

  • Last visited

 Content Type 

Everything posted by solovets-denis

  1. solovets-denis
    Замените на html,body { min-height:100%; }
  2. solovets-denis
    vertical-align сработает в ячейке таблицы, а вот к блоку для этого параметра требуется приписать display:table-cell; (ШУ6-7 не поймет, Сафари 3 не сработает, если внешний блок не будет иметь свойство display:table;). Можно сделать так: 1. Выровнять по центру: .little_point {text-align:center;} 2. "Прибить к полу": .little_point img { position:relative; top:100%; margin-top:-34px; // вместо 34 впишите высоту картинки } Должно помочь.
  3. solovets-denis
    Я, честно говоря, видео просмотрел несколько раз, но т.к. оно существенно шире, чем экран ноута, ничего не понял. Отключите скрипт аккордеона (я так понял, он есть на странице) и посмотрите, сохранилась ли проблема. Быть может, в CSS случилась опечатка и какой-нибудь класс передает body параметр overflow или overflow-y со значением hidden (IE может любую опечатку понять и простить). Выложите какой-нибудь html или css, а то гадать можно долго.
  4. solovets-denis
    Да ладно, никто с такой проблемой не сталкивался?
  5. solovets-denis
    Тогда попробуйте в css3 media queries для этих блоков прописать font-siE:90%; или меньше. Т.е. решить проблему отдельным стилем для мобильных устройств.
  6. solovets-denis
    Если надо "дотянуть" второй див до высоты первого, то посмотрите http://habrahabr.ru/post/64173/ (включая комменты) и http://habrahabr.ru/post/64242/ Но, как было сказано Яндексом, не стоит так уж сильно бояться таблиц. Если таблица помогает решить задачу быстро, просто, без CSS и JS наворотов и кроссбраузерно, то почему бы и нет?
  7. solovets-denis
    Во-первых, укажите в index.html высоту фрейма. Во-вторых, запись background: url(Logo.png) 100% 40% no-repeat; двигает фоновое изображение на 100% от левого края и на 40% от верхней границы. В вашем случае просто пропишите background: url(Logo.png) left top no-repeat;. В третьих, "вытягивание" фона - штука весьма специфическая. Тут и пропорции изображения будут потеряны, да и изображение должно быть либо весьма большим, либо однородным, чтобы на мониторах с большим разрешением не появился эффект размытия. Растянуть картинку как фон можно так: img {display:block; content:""; // для старых версий Оперы width:100%; height:40%;} Итак, мы превратили изображение в блочный элемент, задали ей высоту и ширину. Если есть необходимость разместить на картинке что-то еще, то код будет таким: img {display:block; content:""; // для старых версий Оперы z-index:1;} img, div {position:absolute; width:100%; height:40%;} div {z-index:2;} И код head.html станет таким: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> img {display:block; content:""; // для старых версий Оперы z-index:1;} img, div {position:absolute; width:100%; height:40%;} div {z-index:2;} </style> </head> <body> <img src="image/pass" alt="" /> <div>...</div> </body> </html> Стили лучше убирать в CSS-файл.
  8. solovets-denis
    Приветствую. Возник вот такой вот вопрос. Есть блок со следующими стилями: .block {position:absolute; right:0; bottom:0; left:0; height:6em; max-width:1200px; margin:0 auto;} Верстка «резиновая». При достижении ширины блока в 1200 пикселей все хорошие браузеры выравнивают его по центру. И лишь обожаемый и неповторимый IE имел все в виду в порядке строгой очереди. Стандартные фиксы не спасают (из-за абсолютного позиционирования): .outer {text-align:center;} .outer * {text-align:left;} Есть ли разумное решение проблемы или же имеет смысл не выносить мозг и вложить в .block другой блочный элемент и прописать стили к нему?
  9. solovets-denis
    Вообще полезно использовать reset.css (Яндекс выдаст массу вариаций). Убирает собственные, даже самые неожиданные, стили браузеров всего-то по цене двух килобайт :-)
  10. solovets-denis
    Не стоит вкладывать article в article, это как-то нелогично. Вашу проблему решит float и заданный width.
  11. solovets-denis
    Я бы рекомендовал помучиться с CSS3 Media Queries: все равно постепенно все сайты придук к адаптивному веб-дизайну, так почему бы не начать прямо сейчас? В CSS3 Media Queries можно указать, что при ширине экрана в 720 (400, 240) пикселей блок со статусом получает абсолютное позиционирование и переезжает к логитипу сайта. Так вы оптимально используете пространство и экран пользователя покажет больше полезной информации.
  12. solovets-denis
    Большое спасибо!
  13. solovets-denis
    Проблема с тенями текстов. Эту проблему я бы предложил никак не решать, т.к. имеющиеся в сети варианты - это лишний и весьма громоздкий JS, который не отличается универсальностью. Проблема с уехавшим блоком. Честно, покурил пять минут ваш код, но проблемы так и не увидел. Сам код чистый и новые Ослы его поймут. Наверное, проблема в превьюшке раздела (div.bcategory-image.align-left) и ее margin-right в 15px. Перенесите рисунок в тег H1, можно даже как фон, а к ссылке в H1 задайте padding-left в 48 пикселей, это и строчек кода поубавит, и положение дел должно поправить.
  14. solovets-denis
    Друзья, я тут столкнулся с такой конструкцией в CSS: table [class*=span] {float:none;} Может, кто знает, что это такое?
  15. solovets-denis
    Верстай в 100%. Важно: все браузеры делают отступы от краев по умолчанию. Чтобы избавиться от этого ужаса, необходимо в CSS написать body {margin:0; pasdding:0;}
  16. solovets-denis
    Вполне себе просто решить такую задачку на mootools, а вот посредством css... не, ну можно, но код будет километровый и не для всех браузеров понятный.
  17. solovets-denis
    Рад, что два человека сделали две страницы комментов. Не рад, что не по теме. Маленькая ремарка от автора: 1. Типографика все же важна. Куда приятнее читать хорошо оформленный и сверстанный текст, где тире, как правильно было отмечено, не оказывается в начале строки. 2. Призыв задуматься, как часто пользователь обращает внимание на оформление текстовой информации, по крайней мере странный: я обращаю внимание всегда. Мне сложно читать кусок, написанный 24pt Импактом вперемешку с каким-нибудь декоративным шрифтом а-ля Comic Sans MS. Уверен, вам тоже. 3. Со школьной скамьи мы привыкли видеть тексты, оформленные по определенным правилам. Как бы ни было сложно, эти правила стоит попытаться реализовать в Вебе. Пользователь должен не только иметь возможность найти инфу, но и легко ее усвоить. rash, все те сложности, которые ты встречаешь в оформлении текстов, я готов решить с помощью CSS.Все эти выносы в 20% от высоты текста я напишу без проблем. Меня волнует простой вопрос: как при помощи скрипта поставить перед нужным мне символом свой кусок кода, чтобы не набирать его руками. Т.е. как перед « или Q вставить <span id ="id_name"> </span> или как пробел перед тире автоматически сделать неразрывным. Я хорошо знаю css и html, но ничерта не смыслю в скриптах, если они уже не готовы и не разжованны в ридми, поэтому и прошу вашей помощи. З.Ы. Если вы используете MODx, с удовольствием поделюсь рецептом встраивания автоматического типографа в админку.
  18. solovets-denis
    Уверен, что многие дизайнеры и верстальщики знают два приведенных ниже правила: 1. В оформлении русского текста кавычки должны выглядеть как «елочки». 2. Эти самые кавычки должны выносится за границу текста. Вполне подробно и ясно эти правила для Рунета были озвучены Артемием Лебедевым еще в 2004 и 2005 годах соответственно (см. параграфы Ководства «Кавычки» и «Висячая пунктуация»). Для простоты реализации этого принципа я пользуюсь следующим куском CSS: Q {quotes: '«' '»' '"' '"'; behavior:expression(!this.isInserted==true ? this.isInserted=(this.innerHTML = '«' + this.innerHTML + '»') : '');} Теперь любой текст, заключенный в тэг Q, будет браться в кавычки "елочками". Осталось научить эти кавычки выноситься за границу текста: Q {quotes: '«' '»' '"' '"'; behavior:expression(!this.isInserted==true ? this.isInserted=(this.innerHTML = '«' + this.innerHTML + '»') : ''); margin-left: -8px;} #in { margin-right: 8px; } Этот код хорош тем, что он вынесет кавычку за левую границе текста, если кавычка будет первым символом в строке. А плох он тем, что код, когда кавычка не первая в строке, выглядит так: Слово не <span id="in"> </span><q>воробей</q> Если не брать пробел в id in, то кавычки залезут на предыдущее слово. Вопрос: как написать скрипт, который будет брать пробел перед тэгом Q в айдишник in? Особо ретивое примечание: прежде, чем спрашивать, зачем в примере <span id="in"> </span><q>воробей</q> пробел берется в айдишник, вспомните про верстку в 100% и про то, что положение кавычки может переместиться с середины строки в ее начало.
  19. solovets-denis
    К тексту примени padding. Напимер <marquee>Текст</marquee> преобразуется в <marquee><span style="padding 0 10px;">Текст</span></marquee> (отступ по 10 пикселей) Никогда не использовал бегущих строк. Я бы сделал через ява-скрипт Заключить ее в див. Например уже имеющаяся строка <span style="padding 0 10px;">Текст</span></marquee> преобразуется в <div style="position: absolute; left: 50%; top: 100px;"><span style="padding 0 10px;">Текст</span></marquee></div> В этом случае как бы ти ни прокручивал сайт, строка будет по середине в 100 пикселях от верхней границы брацзера. Ява или подгрузка css с display: none к диву Коли уж совсем "чайник", то поставь конкретную задачу, постараюсь помочь.
  20. solovets-denis
    А на каком движке создается сайт?
  21. solovets-denis
    Пользуйся. Можесь вставить в хтмл-редактор, уже рабочее <style type="text/css"> #fsClipper { height: 330px; width: 100%; overflow: auto; //overflow: hidden; //overflow-x: auto; } .fsControl, #fsLinks a { color: darkblue; cursor: pointer; //cursor: hand; } .fsControl.disabled, #fsLinks a.current { color: #000000; cursor: default; text-decoration: none; } .fsControl.disabled { color: #666666; } #fsScreen { height: 300px ! important; background: no-repeat 50% 50%; } </style> <div id="fsClipper"> <div id="fsScreen"></div> </div> <p> <span id="fsControl_prev" class="fsControl">←</span> <span id="fsControl_next" class="fsControl">→</span> </p> <p id="fsLinks"> <a href="http://www.artlebedev.ru/portfolio/illustrations/i/0ca1b1284e6e6b78.jpg" onclick="return Show_picture( 'http://www.artlebedev.ru/portfolio/illustrations/i/0ca1b1284e6e6b78.jpg', 200, 200 )">он</a>, <a href="http://www.artlebedev.ru/portfolio/illustrations/i/577698ac49499acc.jpg" onclick="return Show_picture( 'http://www.artlebedev.ru/portfolio/illustrations/i/577698ac49499acc.jpg', 200, 200 )">они</a>, <a href="http://www.artlebedev.ru/portfolio/illustrations/i/69d02a844a673326.jpg" onclick="return Show_picture( 'http://www.artlebedev.ru/portfolio/illustrations/i/69d02a844a673326.jpg', 200, 200 )">она</a>, <a href="http://www.artlebedev.ru/portfolio/illustrations/i/69fbeb22269a853d.jpg" onclick="return Show_picture( 'http://www.artlebedev.ru/portfolio/illustrations/i/69fbeb22269a853d.jpg', 200, 200 )">оно</a> </p> <script type="text/javascript"> function Filmstrip(){ this.ePicture = document.getElementById('fsScreen'); this.ePrev = document.getElementById('fsControl_prev'); this.eNext = document.getElementById('fsControl_next'); var eLinks = document.getElementById('fsLinks'); this.aeLink = eLinks.getElementsByTagName('A'); this.show_picture = function( sBackground, iWidth, iHeight ){ this.ePicture.style.backgroundImage = "url(" + sBackground + ")"; if( iWidth ) this.ePicture.style.width = iWidth; if( iHeight ) this.ePicture.style.height = iHeight; this.set_current( sBackground ); } this.set_current = function( sHref ){ for( var i = 0; i < this.aeLink.length; i++ ){ if( this.aeLink[i].href.match( new RegExp( sHref + "$" ) ) ){ this.aeLink[i].className += " current"; this.ePrev.className = this.ePrev.className.replace( /\s+disabled/g, "" ); this.eNext.className = this.eNext.className.replace( /\s+disabled/g, "" ); if( i == 0 ){ this.ePrev.className += " disabled"; this.ePrev.onclick = function(){}; this.eNext.onclick = this.aeLink[i + 1].onclick; }else if( i == this.aeLink.length - 1 ){ this.eNext.className += " disabled"; this.eNext.onclick = function(){}; this.ePrev.onclick = this.aeLink[i - 1].onclick; }else{ this.eNext.onclick = this.aeLink[i + 1].onclick; this.ePrev.onclick = this.aeLink[i - 1].onclick; } }else{ this.aeLink[i].className = this.aeLink[i].className.replace( /\s*current/g, "" ); } } } } var oFilmstrip = new Filmstrip(); function Show_picture( sHref, iWidth, iHeight ){ oFilmstrip.show_picture( sHref, iWidth, iHeight ); return false; } oFilmstrip.aeLink[0].onclick(); </script>
  22. solovets-denis
    Прочитал про доктайпы, вставил нужный, спасибо, буду знать :-) И баг свой исправил.
  23. solovets-denis
    Если честно, не знаю, чем все эти доктайпы различаются :-)
  24. solovets-denis
    Html, css от себя лично и от Студии Лебедева (Сергей Чикуенок), движок MODx Спасибо за ответ, сейчас попробую.
  25. solovets-denis
    >> был не меньше 790, т.е. при размере браузера 790, ширина сайта не уменьшалась Вообще к внешней таблице приписывешь <table width="790px" align=center> (щотя в ссылке, которую ты дал, прописано <table width="96%" align=center>) Если же хочень попробывать применить min-width и max-width, то делай так <table style="max-width: 790px; min-width: 790px; width:expression(document.body.clientWidth > 790px? "790px": "auto" );" align=center>
×
×
  • 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