borus
-
Posts
448 -
Joined
-
Last visited
-
Days Won
1
Content Type
Profiles
Forums
Calendar
Store
Everything posted by borus
-
Добрый день. Столкнулся с тем, что в Хроме градиентный текстурный фон страницы имеет стык, причем если покрутить колесиком масштаб, он исчезает, пока не вернёшься к определённому масштабу. Вот картинка: Почему? В других браузерах такого нет. Вот код: <body> <div id="main"> ... </div> </body> body { font: 14px/21px Verdana, Geneva, sans-serif; text-align: center; color: #003; background: url(images/bg.jpg) repeat; } #main { width: 100%; text-align: center; background: url(images/bg2.jpg) repeat-x top;/*верхний текстурный градиент фона*/ }
-
сделанный в fontsquirrel набор шрифтов типа GOST_B сработал везде кроме Оперы. Это нормально?
-
Благодарю. Да "Новости" - это заголовок sidebar'a. То есть, его надо было в теге h?
-
Да. Вот что у меня получилось. Может посоветуете оптимизацию какую: <div class="news"> <!--блок новостей--> <div class="sidebartopcorners"> <div class="sidebarheader"> <p>Новости</p> </div> </div> <div class="sidebarbody"> <p> новость1</p><p> новость2</p><p> новость3</p> </div> </div> CSS: .news{ margin:5px 0 7px 0; float:right; width: 252px; background: #fff; box-shadow: 0 3px 5px 0px #444; -webkit-box-shadow: 0 3px 5px 0px #444; -moz-box-shadow: 0 3px 5px 0px #444; } sidebartopcorners{ width:100%; border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; -webkit-border--radius: 5px 5px 0 0; } .sidebarheader{ width:100%; height:25px; text-align:center; filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feedb5', endColorstr='#f1d574',GradientType=0 ); /* IE6-9 */ background: -webkit-gradient(linear, left top, left bottom, from(#f1d574), to(#feedb5)); /* for webkit browsers */ background: -moz-linear-gradient(top, #f1d574, #feedb5); /* for firefox 3.6+ */ } .sidebarbody{ width:238px; border-left: #f1d574 2px solid; border-right: #f1d574 2px solid; border-bottom:#f1d574 2px solid; padding: 5px; }
-
это лишь малая часть, как я понимаю. Надо еще сопрячь градиент с рамкой
-
сверху закругления на градиентном фоне, а низ - белое прямоугольное поле с рамкой и вокруг всей формы тень: поделитесь опытом
-
Я использовал ГОСТовский шрифт типа Б. не получается его наклонить через font-style(пробовал italic и oblique) в @font-face. Есть какой-то манёвр для этого?
-
Разобрался, благодарю!
-
SelenIT, а если надо, чтобы две ячейки были шириной по 33% и разбежались влево и вправо? я пробовал добавить в .cell float:left; width: 33%; а в .cell+.cell float:right; но ничего не вышло.
-
Сайт нигде пока не весит. А вы где вывешиваете для таких отладочных целей? Поставил line-height. Похоже это не то, ведь у меня справа в строке контактов две строки (номер и адрес) по разному оформленные(разной высоты). Кстати, как из этих двух строк при разном оформлении каждой сделать единую ссылку ? Вот, что получается с line-height пока (рамки белые - отладочные): <div id ="preheader"> <div> <a href="" alt="ООО Агроминералпро" class="logo">ООО "Агроминералпро"</a> </div> <div id="contact"> <p>(8793)38-35-87</p> <p id="smallwhitetext">г. Пятигорск, ул. Ермолова, д.12А</p> </div> </div> ... CSS: #preheader{ margin: 0 auto 0px; width: 1000px; height: 90px; line-height:90px; vertical-align:middle; color:#fee183; border:1px solid white; } .logo{ height:65px; width:265px; display:block; background:url(images/logo.png) no-repeat; background-position:left center; /*выравнивание картинки*/ padding-left:51px; float:left; color:#fee183; line-height:65px; border:1px solid white; } #contact{ float: right; width:300px; text-align:left; } #smallwhitetext{ color: #fff; font-size:0.7em; } А вот результат: Кстати, если строку <p id="smallwhitetext">г. Пятигорск, ул. Ермолова, д.12А</p> убрать, то еще куда ни шло: но лого-ссылка всё равно не выравнена по верикали относительно опоясывающего контейнера #preheader
-
Почему строка display: inline-block; в .content, а не в .cell?
-
А условные комментарии для IE можно как-то во внешний файл CSS спрятать?
-
это дописывание свойств класса?
-
поясните кодом? не понятно
-
Вот что надо получить: лого и название компании есть единая ссылка, причем название отцентрировано относительно лого. Этот блок + телефон с адресом отцентрированы по вертикали в отдельном контейнере А вот попытки: <div id ="preheader"> <a href="/" alt="ООО Агроминералпро">ООО "Агроминералпро"</a> <div id="contact"> <span> <p>(8793)38-35-87</p> <p>г. Пятигорск, ул. Ермолова, д.12А</p> </span> </div> </div> CSS: #preheader{ margin: 5px auto; width: 1000px; height: 70px; border:1px solid black; vertical-align:middle; display:table-cell; position:relative; overflow: hidden; } #preheader a{ display:block;float:left; width:265px;height:51px; background:url(images/logo.png) no-repeat left; padding-left:10px; } #preheader div{ position: absolute; top: 50%; } #preheader span{ position:relative; top: -50%; } #contact{ float: right; width:300px; text-align:left; }
-
Вставил в <a href=""></a> текст(<a href="">ТЕКСТ</a>). Как его упорядочить по вертикали относительно центра фона логотипа?
-
сначала получилось убрать белые участки за счет радиуса, но правда и верстал меню одной картинкой. потом сделал меню тройным дивом так: HTML: <div class="menu floatright"> <!--ПОИСК--> <div class="leftmenubg"> <div class="rightmenubg"> <ul class="centralsearchbg alignright"> <li><a href="/">Найти</a></li> </ul> </div> </div> </div> CSS: .floatright{ float:right; } .menu{ border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; box-shadow: 0 3px 3px 3px #333;/* Каноническое задание */ -webkit-box-shadow: 0 5px 3px 3px #333; /* Safari, Chrome */ -moz-box-shadow: 0 5px 3px 3px #333; } .centralsearchbg{ background:url(images/menu_bg_c.jpg) repeat-x; height:40px; width:250px; } .leftmenubg{ background:url(images/menu_bg_l.jpg) no-repeat left; height:40px; padding-left:6px; } .rightmenubg{ background:url(images/menu_bg_r.jpg) no-repeat right; height:40px; padding-right:6px; } .alignright{ text-align:right; } и перестало работать. В чем причина, подскажите?
-
да лого - это ссылка
-
а как тогда этот контейнер по координате X привязать к координате X контента? Моя страница центрируется, если уменьшить масштаб просмотра страницы лого может остаться где-то левее начала контента.
-
У меня есть внешний div, который формирует белый фон для контента страницы, у которого было свойство overflow: hidden; Вокруг него лежит текстурный background страницы. Логотип я разместил в headerе, который был внутри указанного дива с overflow: hidden;. Попытался поднять лого с помощью position:relative и top: -100px, чтобы он оказался выше дива на текстурном фоне. Применял z-index и position подходящие для внешнего дива, чтобы лого вышло наверх, но пока не убрал overflow: hidden лого вверх не прошло. Выходит overflow: hidden; главнее z-index? Вот чего надо было добиться: Это так и делается обычно, с помощью position:relative и top: -100px?
-
Вставил картинку и применил тень вида: box-shadow: 0 3px 3px 3px #333;/* Каноническое задание */ -webkit-box-shadow: 0 3px 3px 3px #333; /* Safari, Chrome */ -moz-box-shadow: 0 3px 3px 3px #333; Получилось так: Т.е. тень обошла белые уголки изображения и получилось ненатурально. Скажите как лучше задать тень в данном случае? 1.Вырезать с тенью? 2.создать меню с помощью css, применив градиент и внутреннюю + внешнюю тень? 3....?
-
Зачем ссылки относить к контенту?
-
Скажите, как верстать верхнюю строку меню, содержащую и ссылки и поиск? Вырезать их как одну картинку? или отнести ссылки к контенту, а поиск в правую колонку? http://files.mail.ru/6QVOTL?t=1
