Jump to content

maa

Newbie
  • Posts

    16
  • Joined

  • Last visited

maa's Achievements

Explorer

Explorer (1/14)

0

Reputation

  1. Ребята, вопрос вот в чём: задача: прибить футер книзу(с этим проблем нет), в центре футера меню, а по бокам логотипы. нужно сделать, чтобы футер тянулся, в случае добавления пунктов меню, а боковые логотипы выравнивались по центру высоты футера. Подозреваю, что выравнивать боковые логотипы можно, задав отступ от верха в 30%. А вот сделать резиновый футер - это впервые слышу. Подскажите, пожалуйста.
  2. Здравствуйте, ребята. У меня проблема с оформлением меню и сам я в этом разобраться что-то не могу, а посему прошу помощи у опытных людей. Меню организовано стандартным образом - списком. Левая граница меню оформлена как изображение прибитое к левому краю ul. Между пунктами меню разделители оформлены в виде изображений прибитых к правому краю li: <ul> <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="#">БАЗА ГЛАВНАЯ</a></li> <li class="menu_rb" ><a href="#">RED ГЛАВНАЯ</a></li> </ul> #menu ul{ height:57px; background:url(../img/menu_lbrd.png) left no-repeat; border-right:1px solid green; } #menu li{ float:left; line-height:57px; background:url(../img/menu_lbrd.png) right no-repeat; list-style:none; } #menu li a{ text-decoration:none; color:#385600; padding:20px 30px; } #menu li a:hover{ background:url(../img/menu_hover.png) repeat-x; color:#fff; } #menu li.menu_rb a{ background:url(../img/menuRB_bg.png) repeat-x; color:#385600; } На выходе имею вот что: http://clip2net.com/s/1PoXL http://clip2net.com/s/1PoZk http://clip2net.com/s/1Pp1T Проблемы: 1. Последняя li и правая граница ul имеют зазор. На сколько я представляю, ul должен обтягивать лишки. Почему возникает этот зазор? 2. На hover стоит заполнение цветом(репитится картинка). При этом забивается разделитель-изображение в li, а в первом и левая граница ul. Как мне реализовать меню так, чтобы разделители не забивались заливкой на hover? Полагаю, что проблема здесь не в оформлении, а в логике.
  3. есть блок, в нём изображение. если увеличивать масштаб, картинка тянется по горизонтали (и по вертикали), соответственно ,едет. нужно закрепить как-то картинку, чтобы её, например, центр (или другая точка) оставались на месте, а изображение за счёт масштаба ползло вбок-верх-низ. реально ли сделать так средствами css?
  4. решил вот так: сделал блок .car в него вложил изображение и css .car{ position: absolute; top: 0px; width: 100%; height: 750px; min-width: 1200px; z-index: -3; overflow: hidden; } .car img{ width: 100%; } работает так, как нужно, только вот при масштабировании изображение двигается. как сделать, чтоб закрепить центр, а "росло" оно в бока и верх-низ?
  5. ребят. выскажите любые предположения.
  6. очередная проблема. на рисунке красным обрисован футер. зелёным - по размеру футера полоса, которая должна растягиваться по длине экрана. я то же делал для верхнего меню. но для подвала почему-то не прокатывает (полоса отображается правильно при маленьком масштабе, но если увеличивать - она ползёт вверх и "торчит где-то в центре браузера"). что не так? </div><!-- #footer --> <div class="bottom"></div> /*расположена за футером, перед закрывающим body*/ </body> *************************************************** .bottom{ position: absolute; bottom: 0px; left: 0px; width: 100%; min-width: 1200px; height: 187px; /*высота подвала*/ background-image: url(img/b_foot.png); background-repeat: repeat-x; z-index: -4; }
  7. спасибо. решение как всегда элементарно. моя невнимательность: я был уверен в том, что уже проверял этот вариант.
  8. не помогло. <div class="bttl"> <a href="#">Customized web development latest Belarus</a> <div class="sales"><div class="salleftpart"> </div><div class="salcentrpart"><a href="#">SALES 100%</a></div><div class="salrightpart"> </div></div><!--sales--> </div><!--bttl--> /*********************************************************/ .bttl{ height: auto; float: left; margin: 0 0 18px 0; } .bttl a{ font-size: 1.125em; font-family: Arial, Helvetica, sans-serif; color: #006699; float: left; } .sales{ margin: 0 0 0 10px; height: 16px; float: left; display: inline-block; } .sales a{ color: #fff; font-size: 0.7em; font-family: Arial, Helvetica, sans-serif; text-decoration: none; padding: 2px 0 0 0; } .salleftpart{ width: 7px; height: 100%; float: left; background: url(img/sales_left.png) no-repeat; } .salcentrpart{ height: 100%; width: auto; float: left; background: url(img/sales_center.png) repeat-x; } .salrightpart{ width: 8px; height: 100%; float: left; background: url(img/sales_right.png) no-repeat; }
  9. картинка-ссылка реализована таким образом по определённым причинам. иначе нельзя сделать. это значит, что в такой реализации картинки, я не смогу добиться того, что нужно?
  10. да, ссылки разные. <a href="#">Customized web development latest Belarus</a> <a href="#"><div class="salleftpart"> </div><div class="salcentrpart">SALES 100%</div><div class="salrightpart"> </div></div></a> этот метод не сработал. видимо нужно обязательно учесть, что вторая ссылка реализована тремя блоками(потому что закруглённая и должна тянуться) а с самого начала я делал так: <a href="#">Customized web development latest Belarus</a> <div class="sales"><div class="salleftpart"> </div><div class="salcentrpart"><a href="#">SALES 100%</a></div><div class="salrightpart"> </div></div> то есть за ссылкой шёл блок. который и не слушался. и сейчас не слушается. у ссылок display не указаны вообще.
  11. ещё одна задачка,не могу решить. помогите. есть сслыка. сразу же за ней нужно вставить изображение-ссылку. но она сползает под блок, который образует ссылка. вторая ссылка должна "ползать за основной". то есть в зависимости от наполнения строки. я сперва реализовал отрицательным отступом, но тогда ссылка стоит на месте, а текст заползает под неё. вставлять ссылку в ссылку тоже глупо. на изображении красным показан блок, который первая ссылка отводит себе при переносе. не могу придумать. подскажите, пожалста.
  12. красным выделен блок .cont, в который вложен .block. видно, что зелёный(вложенный) вылазит из родительского. почему так? структура такая: <div class="cont"> <div class="block"> контент блока </div><!--block11--> </div><!--cont--> css: .cont{ width: 1100px; margin: 0 0 0 50px; min-height: 350px; border: 1px solid red; } .block{ width: 340px; height: 375px; float: left; border: 1px solid #0F3; }
  13. .car{ background-image: url(img/body_car.jpg); background-repeat: no-repeat; background-position: center; width: 100%; height: 750px; min-width: 1200px; z-index: -3; border: 1px solid red; } изображение не растягивается. есть мнение, что таким образом (через background) растянуть не получится. можно сделать через вставку тегом img, задать ему ширину 100%. картинка будет растягиваться в ширину блока(=браузера), НО её высота пропорционально увеличится и картинка вылезет из блока внизу. а это как раз и является одной из задач, чтобы не дать ей вылезти (!!нельзя применять скрипты и canvas!! только html+css). ну и вторая задача, которую я, видимо,невнятно описал сперва : - ДОПУСТИМ, центром изображения является значок на капоте. так вот нужно сделать так, чтобы при масштабировании центр=значок оставался на месте, а картинка ползла вширь и ввысь. плюс к этому блок картинки не должен тянуться, а изображение ползти(скрываться) под тёмную полосу вверху и белую полосу внизу блока(здесь она не нарисована ещё). нечто похожее реализовано на http://planeta-kino.com.ua. +/- масштаб - главная картинка стоит.
  14. ребята, совсем нет никаких предположений, как сие сделать?
×
×
  • 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