Помогите сверстать...

musulman · December 15, 2007

Здраствуйте. Проблема не могу сверстать.

Нужно сделать так что бы этот глаз был прижат к футеру и что бы не наежал на текст в правом блоке.

что подскажите господа ?

Fu-tai · December 15, 2007

а это какая часть страницы?

Fu-tai · December 15, 2007

Если правый нижний угол всего сайта, то положите его бэкграундом для body и спозиционируйте background-position: right bottom.

Если это частичка какого-то блока, то тоже самое но для блока.

musulman · December 15, 2007

Да это часть странички. Скажем так нижний блок это футер а то что справа обычный блок.

Сейчас попробуем...

musulman · December 15, 2007

не получается, ладно пойду спать. как говорится утро вечера мудренее

завтра подумаю...

Fu-tai · December 16, 2007

Скинь на почту то что наверстал. Или выложи сюда, для наглядности. Потому что чего там может не получиться непонятно.

musulman · December 16, 2007

сейчас нарисую и скину

musulman · December 16, 2007

Вот, это то что я наверстал а вот и этот геморой

сделал так как Вы писали. Если у праого блока (news) установлен бг то этот доктор уходит под него. Попробывал установить на футер вообще тишина не чего не получается. Что подскажите ?

html :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>_______</title>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=windows-1251">
<link href="indexCSS.css" type="text/css" rel="stylesheet">
<body>

<div class="center">

 <div class="menu">

 <h1>Menu</h1>

 <ul>

 <li><a href="#">Item</a></li>
 <li><a href="#">Item</a></li>
 <li><a href="#">Item</a></li>
 <li><a href="#">Item</a></li>
 <li><a href="#">Item</a></li>
 <li><a href="#">Item</a></li>
 <li><a href="#">Item</a></li>
 <li><a href="#">Item</a></li>
 <li><a href="#">Item</a></li>
 <li><a href="#">Item</a></li>
 <li><a href="#">Item</a></li>

 </ul>



 </div>


 <div class="content">

 <h1>Content</h1>

 <p>TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<p>

 </div>

 <div class="news">

 <h1>News</h1>

 <ul>

 <li><a href="#">CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT </a></li>
 <li><a href="#">CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT </a></li>
 <li><a href="#">CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT CONTEXT </a></li>

 </ul>

 </div>

 <div class="footer"></div>

</div>


</body>
</html>

css :

* {
margin :0;
padding :0;
border :0;
}

body {
font :12pt Verdana, sans-serif;
color :#000;
background :url(images/doctor.gif) right bottom no-repeat;
}

h1 {
font-size :14pt;
font-weight :normal;
text-align :center;
border-bottom:1px solid #ccc;
}

.center {
width :1000px;
margin :0 auto;
}

.menu {
float :left;
width :225px;
height :500px;
margin :15px 0;
padding :5px 5px;
background :#b9eeb9;
border :1px solid #ccc;
}
.menu h1 {
text-align :left;
padding :10px 11px;
border-bottom:1px solid #aaeaaa;
}

.menu ul {
list-style :none;
}

.menu ul li {
margin :5px 5px;
}

.menu li {
display :block;
background :url(images/a_bg.gif) top left no-repeat;
}

.menu li a {
font-family :ArialNarrow;
font-size :13pt;
color :#4a4a4a;
margin-left :20px;
text-decoration:none;
}

.menu li a:hover {
color :#fff;
}

.content {
float :left;
width :500px;
height :500px;
margin :15px 5px;
padding :5px 5px;
border :1px solid #ccc;
}

.content h1 {
font-size :11pt;
font-weight :bold;
margin-top :15px;
text-align :left;
}

.content ul {
list-style :none;
}

.content ul li {
margin-left :10px;
}

.content li a {
color :#000;
}

.content li a:hover {
text-decoration:none;
}
.news {
float :right;
width :225px;
height :500px;
margin :15px 0;
padding :5px 5px;
background :#e1e0e0;
border :1px solid #ccc;
}

.news h1 {
text-align :center;
border-bottom:1px solid #d0cfcf;
}
.news ul {
list-style :none;
}
.news ul li {
margin :5px 5px;
}
.news li a {
color :#000;
}
.news a:hover {
color :red;
}

.footer {
clear :both;
width :1000px;
height :35px;
border :1px solid #ccc;
}

и еще, если будут замечание по коду, что то можно сделать подругому с с удовольствием выслушаю

musulman · December 16, 2007

Все всем спасибо. проблема решена

Отдельное спасибо Scrum`у !!!

Sign In

Помогите сверстать...

Question

musulman

Link to comment

Share on other sites

8 answers to this question

Recommended Posts

Fu-tai

Link to comment

Share on other sites

Fu-tai

Link to comment

Share on other sites

musulman

Link to comment

Share on other sites

musulman

Link to comment

Share on other sites

Fu-tai

Link to comment

Share on other sites

musulman

Link to comment

Share on other sites

musulman

Link to comment

Share on other sites

musulman

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information