Dimanchik87
-
Posts
19 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Posts posted by Dimanchik87
-
-
http://clip2net.unet.by/page/m0/100228 как сделать так,чтобы все элементы формы были по центру страницы как в образце
-
решение найдено letter-spacing
-
Добрый день,
немного не понял, что именно с justify у вас не работает? В примере всего одно слово и по-ширине меньше ширины родительского блока
Хочу растянуть это слово на всю ширину блока
-
Вы лучше бы ссылку на страницу с проблемой дали или на http://jsfiddle.net/ выложили.
Так в монолитном куске кода сложно разбираться. Но в старых ИЕ есть проблемы с z-index - это факт
http://jsfiddle.net/dimanchik87/DHrg8/
Также не пойму почему не работает justify
http://jsfiddle.net/dimanchik87/DHrg8/9/
решение по z-index найдено
вопрос про justify по прежнему актуален
-
Не работает Z-index
В ие отказывается работать z-index,везде всё нормально http://clip2net.unet.by/page/m0/99482 ,а в ИЕ вот так http://clip2net.unet.by/page/m0/99483.
css
*{
margin:0;
padding:0;
}
.top,.bottom{
width:162px;
height:8px;
background:#ebe9e4;
float:left;
margin:0 25px 40px;
}
#news{
clear:both;
margin:0 0 15px 30px;
font:0.8em calibri;
}
#news span{
font:bold 1.2em calibri;
color:#353434;
}
#pict1{
width:578px;
height:204px;
}
#main{
position:relative;
height:315px;
}
#eat{
position:absolute;
top:-5px;
left:24px;
}
#shop{
position:absolute;
top:-5px;
left:236px;
}
#live{
position:absolute;
top:-5px;
left:453px;
}
.vertical{
width:10px;
height:114px;
float:left;
}
#v1{
background:#00639b;
}
#v2{
background:#857372;
}
#v3{
background:#9ccece;
}
.col{
width:162px;
height:122px;
background:#ebe9e4;
float:left;
margin-left:-5px;
margin-top:-170px;
padding-top:180px;
position:relative;
z-index:-1;
}
#main ul,.caption{
list-style:none;
font:0.8em calibri;
clear:both;
overflow:hidden;/*hasLayout for ie*/
}
#main li,.caption{
float:right;
margin-right:20px;
}
.caption{
font:1.5em calibri;
color:#033263;
margin-bottom:15px;
}
#house,#puma,#magazine{
clear:both;
float:left;
height:67px;
}
#house{
width:168px;
}
#puma{
width:165px;
}
#magazine{
width:167px;
height:75px;
margin-top:-7px;
}
.title{
float:left;
clear:both;
font:1.5em calibri;
color:#00639b;
}
.description{
clear:both;
width:150px;
font:0.8em calibri;
}
.description img{
display:inline-block;
width:17px;
height:8px;
}
.bottom{
clear:both;
height:12px;
margin:25px 0 10px;
}
#live .bottom{
margin-top:24px;
}
#footer ul{
clear:both;
list-style:none;
font:0.8em calibri;
color:#899681;
margin:0 0 10px 25px;
}
#footer li{
display:inline;
}
#footer span{
color:blue;
}html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>CONRAN</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class="top"></div>
<div class="top"></div>
<div class="top"></div>
<div id="news"><span>CONRAN NEWS </span>: Special Offers avaliable at selected Conran Restaurants</div>
<img src="pict1.jpg" title="buy online" alt="buy online" id="pict1">
<div id="main">
<div id="eat">
<div class="vertical" id="v1"></div>
<div class="col">
<p class="caption">eat</p>
<ul>
<li>FIND A RESTAURANT</li>
<li>BOOK A TABLE</li>
<li>SPECIAL OFFERS</li>
<li>CONRAN EVENTS</li>
</ul>
</div>
<img src="house.jpg" title="" alt="" id="house">
<p class="title">opening soon</p>
<div class="description">Dublin Bay prawns: lobster fishcakes: sticky toffee pudding and more ...<img src="go.jpg" alt="" title=""></div>
<div class="bottom"></div>
</div>
<div id="shop">
<div class="vertical" id="v2"></div>
<div class="col">
<p class="caption">shop</p>
<ul>
<li>CONRAN SHOP</li>
<li>ONLINE SHOPPING</li>
<li>ACHATS EN LIGNE</li>
<li>CONRAN CONTRACTS</li>
</ul>
</div>
<img src="puma.jpg" title="" alt="" id="puma">
<p class="title">new for autumn</p>
<div class="description">Footwear from Phillipe Starck and Puma in store now <img src="go.jpg" alt="" title=""></div>
<div class="bottom"></div>
</div>
<div id="live">
<div class="vertical" id="v3"></div>
<div class="col">
<p class="caption">live</p>
<ul>
<li>LIVE IT MAGAZINE</li>
<li>CONRAN NEWS</li>
<li>CONRAN CARD</li>
</ul>
</div>
<img src="magazine.jpg" title="" alt="" id="magazine">
<p class="title">live it magazine</p>
<div class="description">Selected highlights from Live It, the Conran magazine <img src="go.jpg" alt="" title=""></div>
<div class="bottom"></div>
</div>
</div>
<div id="footer">
<ul>
<li>TERENCE CONRAN</li>
<li><span> | </span>CONRAN & PARTNERS</li>
<li><span> | </span>CONRAN CARD</li>
<li><span> | </span>CONRAN GROUP</li>
<li><span> | </span>JOBS</li>
<li><span> | </span>CONTACT US</li>
<li><span> | </span>PRIVACY</li>
</ul>
</div>
</body>
</html> -
Всем огромное спасибо.Нашёл вариант
#active{
margin-left:0;
}/*первый пункт*/
.center_menu{
width:14%;
padding:1px;
border:2px solid black;
background:#8bb69f;
float:left;
margin-left:2%;
text-align:center;
}/*все пункты*/
#last{
float:right;
margin-left:auto;/*последний*/
-
думаю в твоем случае не было бы желательно делать вкладки резиновыми, лучше сделать фиксированными. Почему? Будет короткое слово во вкладке, а экран монитора пользователя большой, будет огроменная вкладка по длине и почти пустая.
А если решишь делать резиновыми вкладки, я думаю следует взать 1/7 от ширины - 15% приблизительно (6 вкладок + отступы). Могу ошибаться, но вообще фиксированная ширина для сайта мне кажется предпочтительнее...
Я пытался задавть вкладки шириной 15% и отступы по 2%,вродев сумме 100%,но почему-то не влезает последний блок...
Не понимаю почему,ширина же должна браться от родителя,у него задана ширина 60% в свою очередь у body 100% в теории всё должно работать,а на практике нет.
-
Сложность(для меня)состоит в следующем:
надо сделать вот так http://ifotki.info/12/73628095a1a76f6604d94e349a1dedd7b279f8138503600.jpg.html макет нужен резиновый.Т.е. если я правильно понимаю размеры закладок нужно задать в процентах,но как угадать,чтобы они растянулись на всю ширину центрального блока.Решение необходимо только средствами Html
и Css
P.s.есть вероятность,что я чего-то не догоняю
-
Если я правильно понимаю задачу, то нужно просто уберать отступы от краёв у параграфа, сделать это можно добавив строку margin: 0;
#footer > p {
font-family: arial,helvetica,san-serif;
font-size: 0.9em;
padding: 10px 30px 5px 15px;
margin: 0;
}Обратите внимание, что я убрал отступы именно для параграфа в футере, а не во всём html, где есть параграфы.
Спасибо!Я просто убрал параграф из дива,я про него забыл
))))) -
У меня в FF всё прижимается. Поэтому я и говорю, что видимо ошибка не в этой части кода.
-
Лучше дайте ссылку на сайт, так сложно вникнуть в суть.
Тем более, в той части css, которую вы дали, я ничего полезного не вижу.
сайт не залит на хостинг,страница делается в так сказать учебных целях.Суть в том,что по идее этот текст должен прижиматься к низу страницы(так как в Опере и ИЕ),прописано position:absolute,bottom:0;у контейнера все отступы обнулил,но почему-то в хроме и мозиле всё равно не прижимается!
-
-
Подскажите,пожалуйста,поче му один и тот же div с position:absolute в опере и ИЕ выглядит так
http://hostingkartinok.com/show-image.php?id=d4bf099a17e1e26216c09dec23ef790e а в мозилле и хроме так
http://hostingkartinok.com/show-image.php?id=5ce614899458a1cc0bd84f6ea136eee4
CSS данного блока
#footer{
position:absolute;
bottom:0;
left:560px;
color:#dcd686;
text-align:right;
}
-
1)Картинки не грузятся - да и сами проверим как в Опере
2)Код с файлообменика никто качать не будет - грузи в "песочницу" - к примеру http://cssdesk.com
:mellow:/>
Ну что,появились мысли?
-
-
Помогите,пожалуйста!есть таблица,которая во всех браузерах отображается так http://saveimg.ru/show-image.php?id=...bf599e7ae0b022',а в опере вот так
http://saveimg.ru/show-image.php?id=...54b6041856722b.
Вот тут код http://www.fayloobmennik.net/2347325
-
Неужели никто не знает?
-
Здравсвуйте всем!Я совсем начинающий верстальщик,помогите пожалуйста решить такую проблему:есть три колонки,хедер и футер,футер по умолчанию должен быть прижат к низу,при большом количестве контента сдвигаться вниз.Я написал следующий код,но не могу решить проблему с фоном для колонок(нужно чтобы фон был на всю колонку независимо от контента).Очень жду вашей помощи.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Страница Васи Пупкина</title>
</head>
<style type="text/css">
html,body{
margin:0;
padding:0;
height:100%;
}
#header{
height:50px;
text-align:center;
background:#cf9;
}
#all{
min-height:100%;
margin-bottom:-100px;
}
#left{
float:left;
width:200px;
background:#cf3;
}
#right{
float:right;
width:100px;
background:#f3c;
}
#content{
margin:0 auto;
color:#fff;
background:#ccc;
padding-bottom:100px;
}
#footer{
height:100px;
background:#c63;
}
</style>
<body>
<div id="all">
<div id="header">Добро пожаловать на мою экпериментальную страничку!</div>
<div id="left">ССЫЛКИ<br>ССЫЛКИ<br>ССЫЛКИ<br>ССЫЛКИ<br>ССЫЛКИ<br>ССЫЛКИ<br>ССЫЛКИ<br>ССЫЛКИ</div>
<div id="right">ССЫЛКИ<br>ССЫЛКИ<br>ССЫЛКИ<br>ССЫЛКИ<br>ССЫЛКИ<br>ССЫЛКИ<br>ССЫЛКИ<br>ССЫЛКИ</div>
<div id="content">kgheg ero zdfb afduh fdjbh afbjzfd zdfbj fj f'vbh bvjzndf;kjz hfvjzbf vf' zfdz fd'bh zfjzdf'bh fd jhz fdhzdf bzdfjv zdfjv zfjv zfvh zfjv;z i</div>
</div>
<div id="footer">© Вася Пупкин </div>
</body>
</html>
выравнивание
in HTML Coding
Posted
Вопрос уже не актуален.Всё решается тегом <center>