Помощь по CSS

ven000mus · November 1, 2011

Reveal hidden contents

/* Сделано ven000mus'ом | Автор: ven000mus | Сайт: http://meetastudio.ru */

/*—Сама страница—*/
body{
background: #ffffff url("../images/background.png");
border: 2px dashed #000;
position: relative;
width: 1000px;
margin-left: 500px;
} /* Фон сайта */

a:link{
text-decoration:underline;
color:#D13702;
} /* Формат ссылок */

a:active{
text-decoration:underline;
color:#D13702;
} /* Формат активных ссылок */

a:visited{
text-decoration:underline;
color:#D13702;
} /* Формат посещенных ссылок */

a:hover{
text-decoration:none;
color:#FF0000;
} /* Формат при наведение на ссылку */

/*—Логотип—*/
.logo{
border: 1px dotted #000;
background: url("../images/logo.png");
width: 650px;
height: 150px;
margin-left: 180px;
}

/*—Форма входа—*/
.loginform{
border: 1px dotted #000;
background: #fff;
width: 500px;
height: 300px;
margin-left: 260px;
margin-top: 10px;
}

/*—Кнопка регистрации—*/
a.regbutton:link{
border: 1px dotted #000;
font-size: 30px;
text-decoration: none;
padding: 1px;
}

a.regbutton:active{
border: 1px dotted #000;
font-size: 30px;
text-decoration: none;
padding: 1px;
}

a.regbutton:visited{
border: 1px dotted #000;
font-size: 30px;
text-decoration: none;
padding: 1px;
}

a.regbutton:hover{
border: 1px dotted #000;
font-size: 30px;
text-decoration: underline;
padding: 1px;
}

/*—Новости—*/
.news{
border: 1px dotted #000;
background: #fff;
width: 650px;
height: 150px;

}

/*—Подвал—*/
.footer{
border: 1px dotted #000;
background: #fff;
width: 650px;
height: 50px;
margin-top: 50px;
}

<!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" xml:lang="ru" lang="ru">
<head>
{headers}
<link rel="shortcut icon" href="{THEME}/images/favicon.ico" />
<link media="screen" href="{THEME}/style/styles.css" type="text/css" rel="stylesheet" />
<link media="screen" href="{THEME}/style/engine.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="{THEME}/js/libs.js"></script>
</head>
<body>
{AJAX}
<div class="logo"></div>
<div class="loginform">{login}</div>
<div class="news">Тут будут новости сайта</div>
<div class="footer">Тут будет подвал сайта</div>
</body>
</html>

Я учусь CSS. Так что сильно не ругать.

Указал код вверху.

Вопрос следующий. На сайте будет 4 блока, которые должны находиться по середине экрана на любом браузере и в любом разширение.

Собственно в чем я допустил ошибку. Мне приходиться на глаз каждый блок выравнить в центр ;( Что родителя, что детей.

Вот картинка www.ven000mus.ucoz.ru/1.png

psywalker · November 1, 2011

Ты засунь все блоки в один-общий. В него положи свои блоки. И задай ему ширину и выровни по середине.

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

ven000mus · November 1, 2011

Подумав, решил проблемму так:

<div align="center">

<div class="loginform">{login}</div>

<div class="news">Тут будут новости сайта</div>

<div class="footer">Тут будет подвал сайта</div>

</div>

А в CSS у тега боди оставил лишь фон.

Теперь 2ой вопрос

/*—Логотип—*/

.logo{

border: 1px dotted #000;

background: url("../images/logo.png");

width: 650px;

height: 150px;

}

Как дать ссылкуна весь блок. Так как в блок вбита картинка.

Все, все, все.

Проблему решил

/*—Логотип—*/

a.logo:link{

border: 1px dotted #000;

display:block;

width:650px;

height:150px;

background: url("../images/logo.png");

margin:0 auto;}

ven000mus · November 5, 2011

Всем привет. Опять нужна ваша чутка маленькая помощь.

http://s007.radikal.ru/i300/1111/fb/701888f8e1b6.png - скрин

Reveal hidden contents

<!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" xml:lang="ru" lang="ru">
<head>
{headers}
<link rel="shortcut icon" href="{THEME}/images/favicon.ico" />
<link media="screen" href="{THEME}/style/styles.css" type="text/css" rel="stylesheet" />
<link media="screen" href="{THEME}/style/engine.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="{THEME}/js/libs.js"></script>
</head>
<body>
{AJAX}
<div align="center" class="conteiner">
<div><a class="logo" href="/"></a></div>
<div class="loginform">{login}</div>
<div class="news">Тут будут новости сайта</div>
<div align="right" class="footer">Накалякал <a class="ven000mus" href="/"><s>ven000mus</s></a>, Ол райтс ресёрвед </div>
</div>
</body>
</html>

/* Сделано ven000mus'ом | Автор: ven000mus | Сайт: http://meetastudio.ru */

/*—Сама страница—*/
html, body{
background: #DCE1ED;
height: 100%;
margin: 0px;
padding: 0px;
}

a:link{
text-decoration:underline;
color:#D13702;
} /* Формат ссылок */

a:active{
text-decoration:underline;
color:#D13702;
} /* Формат активных ссылок */

a:visited{
text-decoration:underline;
color:#D13702;
} /* Формат посещенных ссылок */

a:hover{
text-decoration:none;
color:#FF0000;
} /* Формат при наведение на ссылку */

/*—Главный контейнер—*/
.conteiner{
margin: 0 auto;
width: 1000px;
min-height: 100%;
}

/*—Логотип—*/
a.logo:link{
display:block;
width:650px;
height:80px;
margin: 0px;
padding: 0px;
background: url("../images/logo.png");
border-radius: 0px 0px 15px 15px;
-moz-border-radius: 0px 0px 15px 15px;
-webkit-border-bottom-left-radius: 15px;
-webkit-border-bottom-right-radius: 15px;
-khtml-border-radius: 0px 0px 15px 15px;
}

a.logo:active{
display:block;
width:650px;
height:80px;
margin: 0px;
padding: 0px;
background: url("../images/logo.png");
border-radius: 0px 0px 15px 15px;
-moz-border-radius: 0px 0px 15px 15px;
-webkit-border-bottom-left-radius: 15px;
-webkit-border-bottom-right-radius: 15px;
-khtml-border-radius: 0px 0px 15px 15px;
}

a.logo:visited{
display:block;
width:650px;
height:80px;
margin: 0px;
padding: 0px;
background: url("../images/logo.png");
border-radius: 0px 0px 15px 15px;
-moz-border-radius: 0px 0px 15px 15px;
-webkit-border-bottom-left-radius: 15px;
-webkit-border-bottom-right-radius: 15px;
-khtml-border-radius: 0px 0px 15px 15px;
}

a.logo:hover{
display:block;
width:650px;
height:80px;
margin: 0px;
padding: 0px;
background: url("../images/logo.png");
border-radius: 0px 0px 15px 15px;
-moz-border-radius: 0px 0px 15px 15px;
-webkit-border-bottom-left-radius: 15px;
-webkit-border-bottom-right-radius: 15px;
-khtml-border-radius: 0px 0px 15px 15px;
}


/*—Форма входа Фон—*/
.loginform{
background: url(../images/login-bg.png) no-repeat;
width: 610px;
height: 458px;
margin-top: -50px;
padding: 0px;
}

/*—Стиль Логина—*/
.form-login  {
width: 200px;
padding: 10px 4px 6px 3px;
border: 1px solid #DCE1ED;
background: url(../images/login-box.png) no-repeat;
font-size: 16px;
color: #fff;
font-weight: 700;
}

/*—Стиль Пароля—*/
.form-pass  {
width: 200px;
padding: 10px 4px 6px 3px;
border: 1px solid #DCE1ED;
background: url(../images/login-box.png) no-repeat;
font-size: 16px;
color: #fff;
font-weight: 700;
}


/*—Кнопка регистрации—*/
a.regbutton:link{
position: absolute;
text-align: center;
margin: 60px 0 0px 150px;
font-size: 30px;
text-decoration: none;
color: #fff;
font-family: Impact;
}

a.regbutton:active{
position: absolute;
text-align: center;
margin: 60px 0 0px 150px;
font-size: 30px;
text-decoration: none;
color: #fff;
font-family: Impact;
}

a.regbutton:visited{
position: absolute;
text-align: center;
margin: 60px 0 0px 150px;
font-size: 30px;
text-decoration: none;
color: #fff;
font-family: Impact;
}

a.regbutton:hover{
position: absolute;
text-align: center;
margin: 60px 0 0px 150px;
font-size: 30px;
text-decoration: underline;
color: #fff;
font-family: Impact;
}

/*—Кнопка Забыли пароль—*/
a.lostpass:link{
font-size: 12px;
text-decoration: none;
color: #fff;
font-family: Impact;
}

a.lostpass:active{
font-size: 12px;
text-decoration: none;
color: #fff;
font-family: Impact;
}

a.lostpass:visited{
font-size: 12px;
text-decoration: none;
color: #fff;
font-family: Impact;
}

a.lostpass:hover{
font-size: 12px;
text-decoration: underline;
color: #fff;
font-family: Impact;
}

/*—Кнопка Чужой компьютер—*/
.notmycomp{
font-size: 12px;
text-decoration: none;
color: #fff;
font-family: Impact;
}

/*—Кнопка Войти—*/
.enterbutton{
position: absolute;
width: 103px;
height: 42px;
padding: 10px 4px 6px 3px;
margin-left: -100px;
margin-top: 140px;
border: 0px solid #DCE1ED;
background: url(../images/enterbutton.png);
}

/*—Новости—*/
.news{
background: url(../images/news.png);
color: #fff;
width: 500px;
height: 150px;
margin: 0px;
padding: 0px;
border-radius: 15px 15px 15px 15px;
-moz-border-radius: 15px 15px 15px 15px;
-webkit-border-bottom-left-radius: 15px;
-webkit-border-bottom-right-radius: 15px;
-khtml-border-radius: 15px 15px 15px 15px;
}

/*—Подвал—*/
.footer{
margin-top: 80px;
margin-right: 5px;
font-size: 11px;
font-family: Impact;
}

/*—Ссылка ven000mus—*/
a.ven000mus:link{
text-decoration: none;
color: #000;
}

a.ven000mus:active{
text-decoration: none;
color: #000;
}

a.ven000mus:visited{
text-decoration: none;
color: #000;
}

a.ven000mus:hover{
text-decoration: underline;
color: #000;
}


[not-group=5]
	<ul>
			<a href="{profile-link}">
				<img src="{foto}" alt="{login}" />
				<b> </b>
			</a>
			<a id="logbtn" href="#"><b>{login}</b></a>
			<a href="{logout-link}">Выход</a>
				<div>
					<ul>
		[admin-link]<a href="{admin-link}" target="_blank"><b>Админпанель</b></a>[/admin-link]
					<a href="{profile-link}">Мой профиль</a>
					<a href="{favorites-link}">Мои закладки ({favorite-count})</a>
					<a href="{newposts-link}">Непрочитанное</a>
					<a href="/?do=lastcomments">Последние комментарии</a>
					<a href="{stats-link}">Статистика</a>
				</ul>
			</div>
		<a href="{addnews-link}">Добавить новость</a>
		<a href="{pm-link}">{new-pm}</a><a href="{pm-link}">Сообщений</a>
	</ul>
[/not-group]
[group=5]
	<ul>
				<a class="regbutton" href="{registration-link}">Зарегистрироваться</a>
			<form method="post" action="">
				<div>
					<ul>
						<input class="form-login" type="text" name="login_name" id="login_name" />
						<input class="form-pass" type="password" name="login_password" id="login_password" />
						<a class="lostpass" href="{lostpassword-link}">Забыли пароль?</a></label>
						<input type="checkbox" name="login_not_save" id="login_not_save" value="1"/><label class="notmycomp" for="login_not_save"> Чужой компьютер</label>
						<button class="enterbutton" onclick="submit();" type="submit" title="Войти"></button>
					</ul>
					<input name="login" type="hidden" id="login" value="submit" />
				</div>
			</form>
	</ul>
[/group]

Нужна помощь в том чтобы выставить эти формы логина и пароля, правильно... Помогите найти ошибку... Заранее благодарен.

ven000mus · November 6, 2011

Чтож не кто не поможет? ;(

ceil100 · November 6, 2011

а как должно быть?

скрин бы выложип

ven000mus · November 7, 2011

Не хочу показаться грубым. Но смотреть надо внимательней...

Quote
Отправлено 05 ноября 2011 - 23:09
Всем привет. Опять нужна ваша чутка маленькая помощь.
http://s007.radikal....01888f8e1b6.png - скрин

СКРИН - Это ссылка

ceil100 · November 7, 2011

как должно быть, а не как есть!

читать надо внимательней

что и где должно стоять

shuk08 · November 7, 2011

В вашем случае точно также как и для .enterbutton нужно для соответствующих полей указать position: absolute и с помощью left и top сдвинуть в нужное место, хотя было бы проще сделать div, который бы позиционировался указанным способом в нужном месте , а в нем с попмощью margin:auto и vertical-align: Выровнять все кнопки по середине или как-то иначе.

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

a.logo:hover,a.logo:visiteda,.logo:active{

display:block;

width:650px;

height:80px;

margin: 0px;

padding: 0px;

background: url("../images/logo.png");

border-radius: 0px 0px 15px 15px;

-moz-border-radius: 0px 0px 15px 15px;

-webkit-border-bottom-left-radius: 15px;

-webkit-border-bottom-right-radius: 15px;

-khtml-border-radius: 0px 0px 15px 15px;

}

ven000mus · November 8, 2011

On 11/7/2011 at 3:39 AM, ceil100 said:
как должно быть, а не как есть!
читать надо внимательней
что и где должно стоять

Извини за наезд

Вот сделал так как должно быть.

Как должно БЫТЬ

Это индекс

Reveal hidden contents


<!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" xml:lang="ru" lang="ru">
<head>
{headers}
<link rel="shortcut icon" href="{THEME}/images/favicon.ico" />
<link media="screen" href="{THEME}/style/styles.css" type="text/css" rel="stylesheet" />
<link media="screen" href="{THEME}/style/engine.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="{THEME}/js/libs.js"></script>
</head>
<body>
{AJAX}
<div align="center" class="conteiner">
<div><a class="logo" href="/"></a></div>
<div class="loginform">{login}</div>
<div class="news">Тут будут новости сайта</div>
<div align="right" class="footer">Накалякал <a class="ven000mus" href="/"><s>ven000mus</s></a>, Ол райтс ресёрвед </div>
</div>
</body>
</html>


/* Сделано ven000mus'ом | Автор: ven000mus | Сайт: http://meetastudio.ru */

/*—Сама страница—*/
html, body{
background: #DCE1ED;
height: 100%;
margin: 0px;
padding: 0px;
}

a:link{
text-decoration:underline;
color:#D13702;
} /* Формат ссылок */

a:active{
text-decoration:underline;
color:#D13702;
} /* Формат активных ссылок */

a:visited{
text-decoration:underline;
color:#D13702;
} /* Формат посещенных ссылок */

a:hover{
text-decoration:none;
color:#FF0000;
} /* Формат при наведение на ссылку */

/*—Главный контейнер—*/
.conteiner{
margin: 0 auto;
width: 1000px;
min-height: 100%;
}

/*—Логотип—*/
a.logo:link, a.logo:active, a.logo:visited, a.logo:hover{
display:block;
width:650px;
height:80px;
margin: 0px;
padding: 0px;
background: url("../images/logo.png");
border-radius: 0px 0px 15px 15px;
-moz-border-radius: 0px 0px 15px 15px;
-webkit-border-bottom-left-radius: 15px;
-webkit-border-bottom-right-radius: 15px;
-khtml-border-radius: 0px 0px 15px 15px;
}

/*—Форма входа Фон—*/
.loginform{
background: url(../images/login-bg.png) no-repeat;
width: 610px;
height: 458px;
margin-top: -50px;
padding: 0px;
}

/*—Стиль Логина—*/
.form-login  {
width: 200px;
padding: 10px 4px 6px 3px;
border: 1px solid #DCE1ED;
background: url(../images/login-box.png) no-repeat;
font-size: 16px;
color: #fff;
font-weight: 700;
}

/*—Стиль Пароля—*/
.form-pass  {
width: 200px;
padding: 10px 4px 6px 3px;
border: 1px solid #DCE1ED;
background: url(../images/login-box.png) no-repeat;
font-size: 16px;
color: #fff;
font-weight: 700;
}


/*—Кнопка регистрации—*/
a.regbutton:link, a.regbutton:active, a.regbutton:visited{
position: absolute;
text-align: center;
margin: 60px 0 0px 150px;
font-size: 30px;
text-decoration: none;
color: #fff;
font-family: Impact;
}

a.regbutton:hover{
position: absolute;
text-align: center;
margin: 60px 0 0px 150px;
font-size: 30px;
text-decoration: underline;
color: #fff;
font-family: Impact;
}

/*—Кнопка Забыли пароль—*/
a.lostpass:link, a.lostpass:active, a.lostpass:visited{
font-size: 12px;
text-decoration: none;
color: #fff;
font-family: Impact;
}

a.lostpass:hover{
font-size: 12px;
text-decoration: underline;
color: #fff;
font-family: Impact;
}

/*—Кнопка Чужой компьютер—*/
.notmycomp{
font-size: 12px;
text-decoration: none;
color: #fff;
font-family: Impact;
}

/*—Кнопка Войти—*/
.enterbutton{
position: absolute;
width: 103px;
height: 42px;
padding: 10px 4px 6px 3px;
margin-left: -100px;
margin-top: 140px;
border: 0px solid #DCE1ED;
background: url(../images/enterbutton.png);
}

/*—Новости—*/
.news{
background: url(../images/news.png);
color: #fff;
width: 500px;
height: 150px;
margin: 0px;
padding: 0px;
border-radius: 15px 15px 15px 15px;
-moz-border-radius: 15px 15px 15px 15px;
-webkit-border-bottom-left-radius: 15px;
-webkit-border-bottom-right-radius: 15px;
-khtml-border-radius: 15px 15px 15px 15px;
}

/*—Подвал—*/
.footer{
margin-top: 80px;
margin-right: 5px;
font-size: 11px;
font-family: Impact;
}

/*—Ссылка ven000mus—*/
a.ven000mus:link, a.ven000mus:active, a.ven000mus:visited{
text-decoration: none;
color: #000;
}

a.ven000mus:hover{
text-decoration: underline;
color: #000;
}


[not-group=5]
	<ul>
			<a href="{profile-link}">
				<img src="{foto}" alt="{login}" />
				<b> </b>
			</a>
			<a id="logbtn" href="#"><b>{login}</b></a>
			<a href="{logout-link}">Выход</a>
				<div>
					<ul>
		[admin-link]<a href="{admin-link}" target="_blank"><b>Админпанель</b></a>[/admin-link]
					<a href="{profile-link}">Мой профиль</a>
					<a href="{favorites-link}">Мои закладки ({favorite-count})</a>
					<a href="{newposts-link}">Непрочитанное</a>
					<a href="/?do=lastcomments">Последние комментарии</a>
					<a href="{stats-link}">Статистика</a>
				</ul>
			</div>
		<a href="{addnews-link}">Добавить новость</a>
		<a href="{pm-link}">{new-pm}</a><a href="{pm-link}">Сообщений</a>
	</ul>
[/not-group]
[group=5]
	<ul>
				<a class="regbutton" href="{registration-link}">Зарегистрироваться</a>
			<form method="post" action="">
				<div>
					<ul>
						<input class="form-login" type="text" name="login_name" id="login_name" />
						<input class="form-pass" type="password" name="login_password" id="login_password" /><br />
						<a class="lostpass" href="{lostpassword-link}">Забыли пароль?</a></label>
						<input type="checkbox" name="login_not_save" id="login_not_save" value="1"/><label class="notmycomp" for="login_not_save"> Чужой компьютер</label>
						<button class="enterbutton" onclick="submit();" type="submit" title="Войти"></button>
					</ul>
					<input name="login" type="hidden" id="login" value="submit" />
				</div>
			</form>
	</ul>
[/group]

ven000mus · November 9, 2011

Ребят ну правда, нужна помощь.

ven000mus · November 10, 2011

Сам разобрался.

p.s. Спасибо тому кто мне репутацию в минус вогнал. Вообще то я писал в разделе для новичков. Раз писал, значит не знаю решения своей проблемы. Но все же сам разобрался, а смысла снижения мне шкалы репутации не вижу, знал бы что да как, даже бы и не обратился.

Edited November 10, 2011 by ven000mus

ven000mus · November 10, 2011

Проверив все что сделал с индекс страницей во всех браузерах на разширение 1920*1080

Получил не оень хороший ответ от двух браузеров. Это Мозила и Хром ;(

Подскажите пожалуйста, где упустил какое то правило или сделал ошибку ;( Очень нужна Ваша помощь.

И что странно, на работе на мониторе с разширением 1024*768 в Google Chrome все было нормально, так как должно быть, а дома на 1920*1080 тоже в Google Chrome, все не так ;(

Скрины:

Reveal hidden contents

<!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" xml:lang="ru" lang="ru">
<head>
{headers}
<link rel="shortcut icon" href="{THEME}/images/favicon.ico" />
<link media="screen" href="{THEME}/style/styles.css" type="text/css" rel="stylesheet" />
<link media="screen" href="{THEME}/style/engine.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="{THEME}/js/libs.js"></script>
</head>
<body>
{AJAX}
<div align="center" class="conteiner">
<div><a class="logo" href="/"></a></div>
<div class="loginform">{login}</div>
<div class="news">Тут будут новости сайта</div>
<div align="right" class="footer">Накалякал <a class="ven000mus" href="/"><s>ven000mus</s></a>, Ол райтс ресёрвед </div>
</div>
</body>
</html>

/* Сделано ven000mus'ом | Автор: ven000mus | Сайт: http://meetastudio.ru */

/*—Сама страница—*/
html, body{
background: #DCE1ED;
height: 100%;
margin: 0px;
padding: 0px;
}

a:link{
text-decoration:underline;
color:#D13702;
} /* Формат ссылок */

a:active{
text-decoration:underline;
color:#D13702;
} /* Формат активных ссылок */

a:visited{
text-decoration:underline;
color:#D13702;
} /* Формат посещенных ссылок */

a:hover{
text-decoration:none;
color:#FF0000;
} /* Формат при наведение на ссылку */

/*—Главный контейнер—*/
.conteiner{
margin: 0 auto;
width: 1000px;
min-height: 100%;
}

/*—Логотип—*/
a.logo:link, a.logo:active, a.logo:visited, a.logo:hover{
display:block;
width:650px;
height:80px;
margin: 0px;
padding: 0px;
background: url("../images/logo.png");
border-radius: 0px 0px 15px 15px;
-moz-border-radius: 0px 0px 15px 15px;
-webkit-border-bottom-left-radius: 15px;
-webkit-border-bottom-right-radius: 15px;
-khtml-border-radius: 0px 0px 15px 15px;
}

/*—Форма входа Фон—*/
.loginform{
background: url(../images/login-bg.png) no-repeat;
width: 610px;
height: 458px;
margin-top: -50px;
padding: 0px;
}

/*—Стиль Логина—*/
.form-login  {
position: absolute;
margin-left: 70px;
margin-top: 140px;
width: 300px;
height: 30px;
padding: 10px 4px 6px 3px;
border: 1px solid #DCE1ED;
background: #1E4F8A;
font-size: 16px;
color: #fff;
font-weight: 700;
border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-khtml-border-radius: 5px 5px 5px 5px;
}

/*—Стиль Пароля—*/
.form-pass  {
position: absolute;
margin-left: 70px;
margin-top: 220px;
width: 300px;
height: 30px;
padding: 10px 4px 6px 3px;
border: 1px solid #DCE1ED;
background: #1E4F8A;
font-size: 16px;
color: #fff;
font-weight: 700;
border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-khtml-border-radius: 5px 5px 5px 5px;
}


/*—Кнопка регистрации—*/
a.regbutton:link, a.regbutton:active, a.regbutton:visited{
position: absolute;
margin-left: 130px;
margin-top: 70px;
font-size: 30px;
text-decoration: none;
color: #fff;
font-family: Impact;
}

a.regbutton:hover{
position: absolute;
margin-left: 130px;
margin-top: 70px;
font-size: 30px;
text-decoration: underline;
color: #fff;
font-family: Impact;
}

/*—Кнопка Забыли пароль—*/
a.lostpass:link, a.lostpass:active, a.lostpass:visited{
position: absolute;
margin-left: 70px;
margin-top: 280px;
font-size: 12px;
text-decoration: none;
color: #fff;
font-family: Impact;
}

a.lostpass:hover{
position: absolute;
margin-left: 70px;
margin-top: 280px;
font-size: 12px;
text-decoration: underline;
color: #fff;
font-family: Impact;
}

/*—Кнопка Чужой компьютер—*/
.notmycomp{
position: absolute;
margin-left: 280px;
margin-top: 280px;
font-size: 12px;
text-decoration: none;
color: #fff;
font-family: Impact;
}

.checkbox{
position: absolute;
margin-left: 265px;
margin-top: 280px;
}

/*—Кнопка Войти—*/
.enterbutton{
position: absolute;
margin-left: 275px;
margin-top: 330px;
width: 103px;
height: 42px;
padding: 10px 4px 6px 3px;
border: 0px solid #DCE1ED;
background: url(../images/enterbutton.png);
}

/*—Новости—*/
.news{
background: url(../images/news.png);
color: #fff;
width: 500px;
height: 150px;
margin: 0px;
padding: 0px;
border-radius: 15px 15px 15px 15px;
-moz-border-radius: 15px 15px 15px 15px;
-webkit-border-bottom-left-radius: 15px;
-webkit-border-bottom-right-radius: 15px;
-khtml-border-radius: 15px 15px 15px 15px;
}

/*—Подвал—*/
.footer{
margin-top: 80px;
margin-right: 5px;
font-size: 11px;
font-family: Impact;
}

/*—Ссылка ven000mus—*/
a.ven000mus:link, a.ven000mus:active, a.ven000mus:visited{
text-decoration: none;
color: #000;
}

a.ven000mus:hover{
text-decoration: underline;
color: #000;
}

[not-group=5]
	<ul>
			<a href="{profile-link}">
				<img src="{foto}" alt="{login}" />
				<b> </b>
			</a>
			<a id="logbtn" href="#"><b>{login}</b></a>
			<a href="{logout-link}">Выход</a>
				<div>
					<ul>
		[admin-link]<a href="{admin-link}" target="_blank"><b>Админпанель</b></a>[/admin-link]
					<a href="{profile-link}">Мой профиль</a>
					<a href="{favorites-link}">Мои закладки ({favorite-count})</a>
					<a href="{newposts-link}">Непрочитанное</a>
					<a href="/?do=lastcomments">Последние комментарии</a>
					<a href="{stats-link}">Статистика</a>
				</ul>
			</div>
		<a href="{addnews-link}">Добавить новость</a>
		<a href="{pm-link}">{new-pm}</a><a href="{pm-link}">Сообщений</a>
	</ul>
[/not-group]
[group=5]
	<ul>
				<a class="regbutton" href="{registration-link}">Зарегистрироваться</a>
			<form method="post" action="">
				<div>
					<ul>
						<input class="form-login" type="text" name="login_name" id="login_name" />
						<input class="form-pass" type="password" name="login_password" id="login_password" />
						<a class="lostpass" href="{lostpassword-link}">Забыли пароль?</a></label>
						<input class="checkbox" type="checkbox" name="login_not_save" id="login_not_save" value="1"/><label class="notmycomp" for="login_not_save"> Чужой компьютер</label>
						<button class="enterbutton" onclick="submit();" type="submit" title="Войти"></button>
					</ul>
					<input name="login" type="hidden" id="login" value="submit" />
				</div>
			</form>
	</ul>
[/group]

ven000mus · November 10, 2011

Добавил вот такие айди в css и вписал эти айди в див на всю форму входа.

#testoviy{
position: absolute;
margin-left: auto;
margin-top: auto;
}

Все встало так как надо. Но вопрос, правильно ли это?

Прошлые классы и правила не отменял, только добавил выше указанный айди.

Softlink · November 12, 2011

По-моему вы занимаетесь ерундой. Есть ощущение, что здесь можно обойтись и без позиционирования.

ven000mus · November 13, 2011

On 11/12/2011 at 5:17 PM, Softlink said:
По-моему вы занимаетесь ерундой. Есть ощущение, что здесь можно обойтись и без позиционирования.

Может и так. Тогда приподнесите свой вариант, интересно.

Softlink · November 13, 2011

On 11/13/2011 at 10:19 AM, ven000mus said:

On 11/12/2011 at 5:17 PM, Softlink said:
По-моему вы занимаетесь ерундой. Есть ощущение, что здесь можно обойтись и без позиционирования.
Может и так. Тогда приподнесите свой вариант, интересно.

Примерная схема вашей формы http://jsfiddle.net/QFPAx/

ven000mus · November 13, 2011

On 11/13/2011 at 10:33 AM, Softlink said:

On 11/13/2011 at 10:19 AM, ven000mus said:

On 11/12/2011 at 5:17 PM, Softlink said:
По-моему вы занимаетесь ерундой. Есть ощущение, что здесь можно обойтись и без позиционирования.
Может и так. Тогда приподнесите свой вариант, интересно.
Примерная схема вашей формы http://jsfiddle.net/QFPAx/

Благодарю, попробую повозиться с тем что Вы дали... Посмотрев на код, реально понял то я ерундой занимался. Просто я учусь, пока многое не знаю.

gurylyov · November 15, 2011

Для своей задачи\проблемы создавайте отдельную тему.

Edited November 15, 2011 by Softlink

Sign In

Помощь по CSS

Question

Link to comment

Share on other sites

18 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information