Очень прошу, помогите!

Igma · 27.10.2009, 23:43

Цитата:

Сообщение от iDeViL

дайте полный код. У вас <ul id="nav"> находится внутри какого-нибудь контейнера? или отдельно?

написано отдельно...

iDeViL · 28.10.2009, 00:51

лень код давать, дайте ссылку на страницу, сами посмотрим. Так, тыкая в небо пальцем не подскажем

Igma · 28.10.2009, 00:59

Совсем не лень, вот код

Код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Информационный портал для молодых мам</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="default.css" rel="stylesheet" type="text/css" />
<style type="text/css">
body {
background-image: url(images/bg.jpg);
}
</style>
</head>
<body>
<div id="header">
</div>
<div id="page">
<div id="content">
<div class="post">
<h1 class="title">Добро пожаловать на наш сайт!</h1>
<p class="date">октябрь, 2009</p>
<div class="entry">
<p><strong>Здесь Вы найдете всю интересующую Вас информацию о здоровье, развитии и воспитании Вашего малыша,получите практические советы от опытных мам, ........</strong></p>
</div>
<p class="meta"><a href= ""> Оставить отзыв </a></p>
</div>
<div class="post">
<h2 class="title">Добавлен новый раздел!</h2>
<p class="date">сентябрь, 2009</p>
<div class="entry">
<div align="justify">
<blockquote>
<p><strong>орргоотшлоьщлщдлзждзждхэдэ </strong></p>
</blockquote>
</div>
</div>
<p class="meta"> <a href= "">Перейти в раздел </a></p>
</div>
</div>
<ul id="nav">
<li><a href="index.html"><img src="http://web-silver.ru/forum/images/menu_1.gif" width="60" height="55" title="главная страница"/></a></li>
<li><a href="zdorov'e.html"><img src="http://web-silver.ru/forum/images/menu_2.gif" width="65" height="75" alt="здоровье" /></a></li>
<li><a href=""><img src="http://web-silver.ru/forum/images/menu_3.gif" width="65" height="90" alt="воспитание" /></a></li>
<li><a href=""><img src="http://web-silver.ru/forum/images/menu_4.gif" width="65" height="70" alt="развитие" /></a></li>
<li><a href=""><img src="http://web-silver.ru/forum/images/menu_5.gif" width="65" height="85" alt="будущим мамам" /></a></li>
<li><a href=""><img src="http://web-silver.ru/forum/images/menu_6.gif" width="65" height="75"alt="форум"/></a></li>
<li><a href=""><img src="http://web-silver.ru/forum/images/menu_7.gif" width="60" height="55"title="обратная связь"/>
</ul>
<!-- end content -->
<div id="sidebar">
<ul>
  <li>
  <h2>Поиск по сайту</h2>
  <form method="get" action="">
  <fieldset>
  <input type="text" id="s" name="s" value="" />
  <br />
  <input name="submit" type="submit" id="searchsubmit" value="Найти" />
  </fieldset>
  </form>
  </li><li>      
  <!-- end sidebar -->
  </li>
</ul>
</div>
<div style="clear: both;">
<!-- end page -->
<img src="http://web-silver.ru/forum/images/2.jpg"width="768" height="133" /></div>
</div>
</body>
</html>

вот css

Код:

body {
	margin-bottom:20px;
	margin-top: 30px;
	margin-left:20px;
	margin-right:20px;
	padding: 0px;
	background: #4C4C4C;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
	color: #660066;
}

h1, h2, h3 {
	margin-top: 0;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #846CCB;
	text-align: center;
	vertical-align: middle;
}

h1 {
	letter-spacing: -1px;
	font-size: 2.4em;
}

h2 {
	font-size: 1.8em;
}

h3 {
	font-size: 1.2em;
	font-weight: bold;
}

p, ul, ol {
	margin-bottom: 1.8em;
	line-height: 2em;
}

p {
}

blockquote {
	font-style: italic;
}

ul {
}

ol {
}
#nav {
	position: absolute;
	top: 268px;
	right: 200px;
	width: 52px;
	margin: 0;
	padding: 0;
	height: 497px;
}

#nav li {
    width: 31px;
    padding: 0;
    margin: 0;
    list-style: none;
	}
	#nav img {
    display: inline;
	}
a {
	text-decoration: none;
	border-bottom: 1px solid #BFC6E3;
	color: #145BF9;
}

a:hover {
	border: none;
}

small {
}

hr {
	display: none;
}

img {
	border: none;
}

img.left {
	float: left;
	margin: 0 15px 0 0;
}

img.right {
	float: left;
	margin: 0 0 0 15px;
}

/* Header */

#header {
	width: 775px;
	height: 237px;
	margin: 0 auto;
	background: url(images/img01.jpg);
}

#header h1, #header h2 {
	float: left;
	margin: 0;
}

#header h1 {
	padding: 155px 0 0 20px;
	letter-spacing: 5px;
	font-size: 3em;
}

#header h2 {
	padding: 175px 0 0 5px;
	font-size: 1.4em;
}

#header a {
	border: none;
	color: #FFFFFF;
}

/* Page */

#page {
	width: 770px;
	margin: 0 auto;
	background: #FFFAFA url(images/img02.gif) repeat-x;
	border-right: 5px solid #414141;
}

/* Content */

#content {
	float: left;
	width: 460px;
	padding: 30px 20px;
}

/* Post */

.post {
	margin-bottom: 2em;
}

.post .title {
	margin: 0;
}

.post .title a {
	border: none;
	color: #846CCB;
}

.post .title a:hover {
	color: #145BF9;
}

.post .date {
	margin: 0 0 2em 0;
	font-size: .7em;
}

.post .entry {
}

.post .meta {
	padding: 5px 20px;
	background: #ABE0CC;
	color: #1451F4;
}

.post .meta a {
	color: #1451F4;
}

/* Sidebar */

#sidebar {
	float: right;
	width: 240px;
	padding: 10px 20px 0 0;
	color: #FF89ED;
	background-color: #FF89ED;
}

#sidebar ul {
	margin-top: 20px;
	padding: 0;
	list-style: none;
}

#sidebar li {
	margin-bottom: 10px;
	background: #FF89ED;
}

#sidebar li ul {
	padding: 15px;
}

#sidebar li li {
	margin: 0;
}

#sidebar li h2 {
	margin: 0;
	padding: 5px 15px;
	background: #F20CD7;
	font-size: 1.4em;
	color: #FFFFFF;
}

#sidebar a {
	border: none;
	color: #FFFFFF;
}

#sidebar form {
	margin: 0;
	padding: 15px;
}

#sidebar fieldset {
	border: none;
}

#sidebar input {
	font: normal 1em Verdana, Arial, Helvetica, sans-serif;
}

#sidebar #s {
	width: 190px;
}

/* Footer */

#footer {
	width: 775px;
	margin: 0 auto;
	padding: 15px 0;
	background: url(images/img03.gif) no-repeat;
}

#footer p {
	margin: 0;
	line-height: normal;
	font-size: .8em;
	color: #999999;
}

#footer a {
	border: none;
	font-weight: bold;
	color: #999999;
}

#footer a:hover {
	color: #FFFFFF;
}

iDeViL · 28.10.2009, 01:12

а, ну проблема очевидна: центральный контейнер фиксированной ширины, при масштабировании его левая граница смещается, а вот меню справа закрепляется относительно правой границы окна и неподвижно. Решить можно несколькими способами, первый, который приходит на ум - сделать большую таблицу с двумя столбцами. В левом столбце - центральная часть, в правом - менюшка.
Кстати, то, что в самом начале нормально смотрится - просто совпадение. Если открывать его в меньшем окне, то будет смотреться хуже

второе решение - использовать большой див, в нем точно расположить все элементы, а его уже по центру.
третье - использовать float и clear, но с ними могут возникнуть другие проблемы.
4 решение - использовать в конце концов jscript, который при загрузке и изменении окна будет узнавать position.right для вашего меню (ul).
чтобы центральная часть была именно по центру - наверное, только 4 способ. Но он самый сложный. Все остальные (особенно: первые два) гораздо проще, но в них центральная часть будет смещена чуть-чуть влево. Думаю, в вашем случае это то, чем можно пожертвовать.

Igma · 28.10.2009, 01:24

Спасибо вам большое

сейчас все исправлю

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Прошу помощи. Для меня это очень важно!	Фырка	HTML, CSS, JavaScript	9	06.02.2009 16:45
Система закачки изображений. Очень прошу всех заценить	Асмодиан	Кальянная	10	27.12.2008 12:46
Помогите! тормоза в мульте, очень нужна помощь	oblomoff	Технологии Flash	4	16.04.2007 18:41
Zurich, Futura - очень нужны шрифты, помогите...	zzibn	Векторный арт	4	26.02.2007 10:02
Помогите разобратся - ОЧЕНЬ НУЖНО!	[ none ]	HTML, CSS, JavaScript	6	11.02.2004 15:02

28.10.2009, 00:51	#12
iDeViL	лень код давать, дайте ссылку на страницу, сами посмотрим. Так, тыкая в небо пальцем не подскажем

28.10.2009, 01:12	#14
iDeViL	а, ну проблема очевидна: центральный контейнер фиксированной ширины, при масштабировании его левая граница смещается, а вот меню справа закрепляется относительно правой границы окна и неподвижно. Решить можно несколькими способами, первый, который приходит на ум - сделать большую таблицу с двумя столбцами. В левом столбце - центральная часть, в правом - менюшка. Кстати, то, что в самом начале нормально смотрится - просто совпадение. Если открывать его в меньшем окне, то будет смотреться хуже второе решение - использовать большой див, в нем точно расположить все элементы, а его уже по центру. третье - использовать float и clear, но с ними могут возникнуть другие проблемы. 4 решение - использовать в конце концов jscript, который при загрузке и изменении окна будет узнавать position.right для вашего меню (ul). чтобы центральная часть была именно по центру - наверное, только 4 способ. Но он самый сложный. Все остальные (особенно: первые два) гораздо проще, но в них центральная часть будет смещена чуть-чуть влево. Думаю, в вашем случае это то, чем можно пожертвовать. Последний раз редактировалось iDeViL; 28.10.2009 в 01:19..

28.10.2009, 01:24	#15
Igma	Спасибо вам большое сейчас все исправлю

27.10.2009, 23:43
Ссылки