art-Limon
-
Posts
18 -
Joined
-
Last visited
art-Limon's Achievements
Explorer (1/14)
0
Reputation
-
Я о том, что это нужно будет еще использовать. Суть ведь не меняется - выношу стили в отдельный файл или тут же прописываю - сейчас итог тот, что блок не выравнивается ( Как правильно выровнять?
-
1. С доктайпом и в самом деле иначе макет ведет себя) 2. margin:0 auto; добавляю именно к тобу диву, который хочу выровнять по центру (блок Конттент вложен, след-но должен оказаться по центру) 3. ширина дива, который необходимо выровнять, =960рх посмотрите картинку, пож-та, В итоге должно получиться так http://www.free-lance.ru/users/Art-limon/v...p?prjid=2291716 пытаюсь разобраться - как же это забабахать) делаю для себя, чтобы понять все азы.. Верстка осложняется тем. что вставляться код будет в редактор и отдельно классы и id не подключить, не читает он их.. так что все стили прям тут и писать нужно будет..
-
Приветствую! Учусь верстать.. В процессе возникают вопросы. Прошу помочь разобраться) 1. Зависла на выравнивание по ширине. Контент должен быть по середине. Для содержащего его дива прописала margin:0 auto; но не выравнивается, все равно прижат к левому краю. В чем ошибка? <div style="background:#CCC; color:#737373; font:14px/18px arial; margin:0;"> <div style="margin:0 auto; padding:0 0 20px; width:960px;"> <div style="height:50px; padding:20px;">Пояснительный текст</div> <div style="background:#FFF; padding:20px; width:960px;">Контент</div> </div> </div>
-
Приветствую! Есть шаблон. <!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Документ без названия</title> <link href="http://maltin.ru/artlemon/shablon/css/layout.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="wrapper"> <div id="top">Предоплата 100%. Бесплатная доставка примерно 1-2 недели.<br /> <span>ВНИМАНИЕ!</span> Кликайте по кнопке <em>«Купить сейчас»</em> только когда собираетесь приобрести товар!</div> <div id="container"> <div id="content"> <div style="font:12px arial;text-align:right"><a href="#"></a></div> <div class="title"> <div>Art Lemon</div> Стильные ГАЛОШИ. <small>Дизайнерская модель</small> <span></span></div> <p style="font:16px/20px arial"><strong class="orange">Очень стильные и милые ГАЛОШКИ</strong> — совершенны в своей лаконичности, в тоже время очень женственны и сексуальны.<br /> Такая обувь обязательно должна быть у Вас в гардеробе!</p> <p>Не любите дождь? ...<br /> С такой обувью Вы будете мечтать о лужах!!! <img src="http://maltin.ru/artlemon/shablon/images/smile.png" width="19" height="23" alt="" /></p> <p class="ta_center"><img src="http://maltin.ru/artlemon/foto/161110/1.gif" alt="" width="600" height="600" /></p> <p class="ta_center"><img src="http://maltin.ru/artlemon/foto/161110/2.gif" width="600" height="600" alt="" /></p> <p class="ta_center"><img src="http://maltin.ru/artlemon/foto/161110/3.gif" width="600" height="472" alt="" /></p> <p class="ta_center"><img src="http://maltin.ru/artlemon/foto/161110/4.gif" width="600" height="600" alt="" /></p> <h3><b><span>ОПИСАНИЕ лота</span></b></h3> <p> СОСТОЯНИЕ: новое, без коробки<br /> МАТЕРИАЛ: резина<br /> ЦВЕТ: черный<br /> ВЫСОТА КАБЛУКА: 9 см<br /> РАЗМЕР: 37 (европейский) </p> <br /> <h3><b><span>СТОИМОСТЬ лота</span></b></h3> <p style="font:bold 22px arial">КУПИТЕ этот лот <span class="orange">всего за <em><span style="font:italic 48px arial">1'499</span> руб.</em></span></p> <br /> <h3><a name="buy"></a><span>КАК КУПИТЬ?</span></h3> <p><a href="https://ssl.molotok.ru/Register.php">Регистрируетесь</a>, если Вы здесь впервые.</p> <p>Внимательно знакомитесь с лотом и убеждаетесь — «Это именно то, что я хотел(а)!» (также обращаете внимание на стоимость, условия оплаты и доставки).</p> <p><span class="number">1</span>Нажимаете кнопку <em>«Купить сейчас»</em>, после чего Вам на почту присылается адрес моей электронной почты и другие контактные данные.</p> <p><span class="number">2</span>Сообщаете мне по электронной почте Ваши ФИО, номер мобильного телефона и полный адрес с индексом (желательно все в одном письме - стандартной форме «Молотка», доступной после ставки).</p> <p><span class="number">3</span>В ответном письме Вы получаете реквизиты для оплаты, оплачиваете лот и информируете меня о том, что оплата произведена.</p> <p><span class="number">4</span>После получения предоплаты товар отправляется Вам.</p> <p><span class="number">5</span>Ждете - Получаете - Пользуетесь_Носите_Дарите - Радуетесь! (=</p> <p>P/S:</p> <p class="orange">ВСЕ ОЧЕНЬ ПРОСТО!</p> <p>На любые вопросы с удовольствием дам ответ в форуме лота. Для этого пройдите по ссылке <em>«Обсудить лот»</em> на страницу интересующего Вас лота и оставьте вопрос в форуме.</p> <br /> <h3><a name="pay"></a><span>ОПЛАТА</span></h3> <a href="http://molotok.ru/country_pages/168/0/education/pok/index.php"><img style="float:right;margin-left:20px" src="http://maltin.ru/artlemon/shablon/images/pzp.gif" width="110" height="109" alt="Программа защиты покупателей" /></a> <p><b class="orange">ПРЕДОПЛАТА 100%.</b><br /> </p> <p><b class="orange">СПОСОБЫ ОПЛАТЫ</b> - любой удобный для Вас:</p> <p><span class="number">а</span>Банковские переводы, переводы на карту или онлайн-банкинг:</p> <ul class="payment"> <li><a href="http://www.alfabank.ru/"><img src="http://maltin.ru/artlemon/shablon/images/alfabank.gif" width="88" height="31" alt="Альфа-банк" /></a><br /> а.1. Альфа-Банк </li> <li><a href="http://www.alfabank.ru/"><img src="http://maltin.ru/artlemon/shablon/images/sberbank.gif" width="88" height="31" alt="Сбербанк" /></a><br /> а.2. Сбербанк </li> </ul> <p><span class="number">б</span>Электронные деньги:</p> <ul class="payment"> <li><a href="http://www.webmoney.ru/rus/index.shtml"><img src="http://maltin.ru/artlemon/shablon/images/webmoney.gif" width="88" height="31" alt="Webmoney" /></a><br /> б.1. WebMoney</li> <li><a href="http://money.yandex.ru/"><img src="http://maltin.ru/artlemon/shablon/images/yandexmoney.gif" width="88" height="31" alt="Яндекс.Деньги" /></a><br /> б.2. Яндекс Деньги</li> </ul> <p><span class="number">в</span>Денежные переводы:</p> <ul class="payment"> <li><a href="http://www.sbrf.ru/moscow/ru/person/transfers/blitz/"><img src="http://maltin.ru/artlemon/shablon/images/blic.gif" width="88" height="31" alt="БЛИЦ" /></a><br /> в.1. Блиц</li> <li><a href="http://www.anelik.ru/"><img src="http://maltin.ru/artlemon/shablon/images/anelik.gif" width="88" height="31" alt="Анелик" /></a><br /> в.2. Анелик</li> <li><a href="http://www.perevod-korona.com/"><img src="http://maltin.ru/artlemon/shablon/images/goldcrown.gif" width="88" height="31" alt="Золотая Корона" /></a><br /> в.3. Золотая Корона и др.</li> </ul> <p><span class="number">г</span>Терминалы</p> <p><span class="number">д</span>Рассмотрю Ваши предложения.</p> <br /> <h3><a name="get"></a><span>ДОСТАВКА</span></h3> <p><b>СТОИМОСТЬ доставки -</b> <b class="orange">БЕСПЛАТНО</b>.<br /> </p> <p><b>Доставка в течении</b> <b class="orange">1-2 недель.</b><br /> </p> <div class="title"> <div>Art Lemon</div> УДАЧНЫХ ПОКУПОК! <small>С уважением, Мария.</small></div> <p><b>Полезные ссылки:</b></p> <p><a href="#">Все мои лоты на Молотке</a><br /> Уверена, Вы сможете найти что-то интересное для себя, своих близких и друзей!</p> <p><a href="http://msk.molotok.ru/show_user.php?uid=16588028">Отзывы обо мне</a><br /> Отзывы от Покупателей, которые совершали со мной сделки.</p> <p><a href="http://molotok.ru/country_pages/168/0/education/guide/index.php?page=3&type=2">Как безопасно совершать покупки на Молотке?</a><br /> Подробно о мерах предосторожности Покупателей.</p> <p><a href="http://molotok.ru/country_pages/168/0/education/pok/index.php">Програма защиты покупателей</a><br /> Подробно о Программе защиты покупателей со стороны <a href="http://molotok.ru/">Молотка</a>.</p> </div> <div id="column"> <ul> <li><a href="#">Все лоты</a></li> <li><a href="#buy">Как купить?</a></li> <li><a href="#pay">Оплата</a></li> <li><a href="#get">Доставка</a></li> </ul> </div> <div class="corner-tl"></div> <div class="corner-tr"></div> <div class="corner-bl"></div> <div class="corner-br"></div> </div> </div> </body> </html> body { background:#ccc; color:#808080; font:14px/18px arial; margin:0 } img { border:0 } a { color:#77b200; outline:0 } a:hover { text-decoration:none } p { margin:0 0 15px; padding:0 0 0 20px } .clr { clear:both } .ta_center { padding:0; text-align:center } .ta_center img { border:1px solid #999 } .orange { color:#d96c00 } #wrapper { margin:0 auto; padding:0 0 25px; width:960px } #top { height:49px; padding:11px 0 0 20px } #top span { color:#b20000 } #container { background:#fff; height:1%; overflow:hidden; padding:20px; position:relative } #container .corner-tl { background:url(http://maltin.ru/artlemon/shablon//images/corner.gif); font-size:0; height:10px; left:0; position:absolute; top:0; width:10px } #container .corner-tr { background:url(http://maltin.ru/artlemon/shablon//images/corner.gif) -10px 0; font-size:0; height:10px; position:absolute; right:0; top:0; width:10px } #container .corner-bl { background:url(http://maltin.ru/artlemon/shablon//images/corner.gif) 0 -10px; font-size:0; bottom:0; height:10px; left:0; position:absolute; width:10px } #container .corner-br { background:url(http://maltin.ru/artlemon/shablon//images/corner.gif) -10px -10px; font-size:0; bottom:0; height:10px; position:absolute; right:0; width:10px } * html #container .corner-bl, * html #container .corner-br { bottom:-1px } #content { float:right; width:720px } #content .title { background:url(http://maltin.ru/artlemon/shablon//images/title.gif) no-repeat 0 100%; font:bold 36px/54px arial; margin:0 0 20px; text-align:center } #content .title small { font:bold 18px arial } #content .title span { font:bold 30px arial } #content .title div { color:#ffe100; font:bold 22px arial; padding:0 0 0 40px; text-align:left } #content .number { background:url(http://maltin.ru/artlemon/shablon//images/number.gif); display:inline-block; height:20px; line-height:20px; margin-right:5px; text-align:center; width:20px } #content .payment { height:1%; list-style:none; margin:0 0 15px; overflow:hidden; padding:0 0 0 70px } #content .payment li { display:inline; float:left; font:12px arial; padding-right:20px } #content .payment img { margin:0 0 3px } #content h3 { background:url(http://maltin.ru/artlemon/shablon//images/h3.gif) no-repeat; font:22px/40px arial; margin:0 0 15px; padding-left:20px } #content h3 span { background:url(http://maltin.ru/artlemon/shablon//images/h3_span.gif) no-repeat 100% 0; display:inline-block; height:40px; padding-right:20px } #column { display:inline; float:left; padding:75px 0 0; width:180px } #column ul { line-height:0; list-style:none; margin:0; padding:0 } #column a { color:#808080; display:block; font:22px/45px arial; padding-left:20px; text-decoration:none; text-transform:uppercase } #column a:hover, #column .active a { background:url(http://maltin.ru/artlemon/shablon//images/column_a.gif) } При загрузке на сайт (http://molotok.ru/) он ломается. Помогите внести изменения в соответствии с требованиями Молотка, чтобы шаблон отображался корректно. Про ограничения пишут тут http://molotok.ru/help_item.php?tid=251&am...1080&zoom=N и тут http://molotok.ru/help_item.php?zoom=N&item=1013 Вчитываюсь, пробую, но не хватает знаний (шаблон сделан не мною..), По-о-огите!
-
Задача решена. Отдельное спасибо eVErl@Sting!
-
Расскажи, пож-та, прям очень подробно - КАК? КАК у тебя это получилось!!! =) и как пользоваться ссылкой вот этой (http://code.google.com/p/rocon/) - тут все нанерусском и JS я совсем не знаю - но! оч хочу разобраться!
-
http://garant-vrn.ru/sistema-garant/... но ИЕ печалит..
-
Ага, картинка еще одним дивом. Спасибо! С IE можно как-нибудь побороться (картинка на месте, а вот уголки да, квадратные..)?
-
Спасибо за живой пример!!! На самом деле я прочитала все эти способы, но применить корректно не получилось - сейчас Ваше решение сижу разбираю. Подскажите, каким образом здесь картинку (<img src="http://garant-vrn.ru/img/podskazka/voskl-znak.png" alt="внимание" width="30" height="30" border="0" align="middle" />) разместить?
-
Приветствую! и прошу сразу не закидывать помидорами))) Задача: создать такую штучку - картинка с восклицательным знаком + текст в красной рамке с скругленными углами Как это сделать?! Мой способ, кажется.. ой-как сильно кажется, что нерационален.. <table width="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="60"> </td> <td><img src="http://garant-vrn.ru/img/podskazka/uvl.gif" width="15" height="15" border="0" /></td> <td width="100%"><img src="http://garant-vrn.ru/img/podskazka/vgp.gif" width="100%" height="15" border="0" /></td> <td><img src="http://garant-vrn.ru/img/podskazka/uvp.gif" width="15" height="15" border="0" /></td> </tr> <tr> <td width="60"><img src="http://garant-vrn.ru/img/podskazka/voskl-znak.png" alt="внимание" width="30" height="30" border="0" /></td> <td><img src="http://garant-vrn.ru/img/podskazka/lvp.gif" width="15" height="100%" border="0" /></td> <td bgcolor="#FFFFFF"> <p><b>Индивидуальный подход</b></p> <p>Ваш персональный информационный банк формируется из нужных именно Вам информационных блоков с максимальным учетом Ваших индивидуальных особенностей. Гибкий подход к формированию комплекта позволяет получать только нужное и не переплачивать за лишнее.</p></td> <td><img src="http://garant-vrn.ru/img/podskazka/pvp.gif" width="15" height="100%" border="0" /></td> </tr> <tr> <td width="60"> </td> <td><img src="http://garant-vrn.ru/img/podskazka/unl.gif" width="15" height="15" border="0" /></td> <td width="100%"><img src="http://garant-vrn.ru/img/podskazka/ngp.gif" width="100%" height="15" border="0" /></td> <td><img src="http://garant-vrn.ru/img/podskazka/unp.gif" width="15" height="15" border="0" /></td> </tr> </table>
-
Спасибо, возьму на вооружение.
-
Спасибо. Такое решение, конечно, уже лучше.. (внесла изменения http://garant-bryansk.ru/service/online-seminar/), но.. Как пользователь, желающий посмотреть фото, я прокручиваю страницу так, чтобы они были по центру. При просмотре их прижимает вверх страницы, а хочется, чтобы они остались на прежнем месте (серединка экрана на глазок пользователя).. *Шапку почистила)
-
Приветствую! Мне необходимо разместить несколько фотографий на странице и так, чтобы несколько превьюшек, а при клике на превью - большая фото менялась. Реализовала вот так: http://garant-bryansk.ru/service/online-seminar/ <div class="block" align="center"> <a href="#" onmouseout="document.preview1.src='http://garant-bryansk.ru/img/img-sem/1s.jpg'" onclick="document.preview.src='http://garant-bryansk.ru/img/img-sem/1.jpg';"> <img name="preview1" src="http://garant-bryansk.ru/img/img-sem/1s.jpg"></a> <a href="#" onmouseout="document.preview1.src='http://garant-bryansk.ru/img/img-sem/2s.jpg'" onclick="document.preview.src='http://garant-bryansk.ru/img/img-sem/2.jpg';"> <img name="preview1" src="http://garant-bryansk.ru/img/img-sem/2s.jpg"></a> <a href="#" onmouseout="document.preview1.src='http://garant-bryansk.ru/img/img-sem/3s.jpg'" onclick="document.preview.src='http://garant-bryansk.ru/img/img-sem/3.jpg';"> <img name="preview1" src="http://garant-bryansk.ru/img/img-sem/3s.jpg"></a> <a href="#" onmouseout="document.preview1.src='http://garant-bryansk.ru/img/img-sem/4s.jpg'" onclick="document.preview.src='http://garant-bryansk.ru/img/img-sem/4.jpg';"> <img name="preview1" src="http://garant-bryansk.ru/img/img-sem/4s.jpg"></a> <br> <img name="preview" src="http://garant-bryansk.ru/img/img-sem/1.jpg"> </div> НО! при клике на следующую превью - хоть фото и меняется, пользователя перекидывает на шапку, в начало страницы. Как это исправить?
-
вот что получается - http://art-limon.ru/ - кнопки почему-то в IE7 лесенкой.. <div class="nav"> <ul> <li><a href="#" class="li-bg-l">О ЦЕНТРЕ</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> <li><a href="#" class="li-bg-r">КОНТАКТЫ</a></li> </ul> </div> * { margin: 0; padding: 0;} ul, li { list-style: none;} img { border-width: 0;} body { width: 1150px; margin: 0 auto; background-color: #1d1d1d;} body { font-family: "Trebuchet MS", Arial, sans-serif; font-size: 11pt; color:#FFFFFF; } a { color: #ffffff; text-decoration: underline;} #header { background-image:url(../img/header/bgimg.jpg); width: 1150px; height: 300px; vertical-align: top; margin: auto;} .discount { width: 165px; height: 72px; position: relative; left: 204px; top: 178px;} .nav { margin: 0px;} .li-bg-l{ float:left; width:165px; height:32px; text-align:center; background-image:url(../img/nvg/libgl.gif); padding:18px 0 0 0; } .li-bg-l:hover{ background: url(../img/nvg/libgl-on.gif); } .nav li a { float:left; width:165px; height:32px; text-align:center; background-image:url(../img/nvg/libg.gif); padding:18px 0 0 0;} .nav li a:hover { background: url(../img/nvg/libg-on.gif);} .li-bg-r{ float:left; width:165px; height:32px; text-align:center; background: url(../img/nvg/libgr.gif); padding:18px 0 0 0;} .li-bg-r:hover{ background: url(../img/nvg/libgr-on.gif);}
-