На сайте есть лишняя область, которая не нужна! Как её убрать?

Статус
Закрыто для дальнейших ответов.

Pavl

Active Member
Регистрация
28.09.2016
Сообщения
43
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html style="width: 1920px;">
<body>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<link rel="stylesheet" href="style113.css">
<link rel="stylesheet" href="normalize.css">
<title>Главная</title>
<link rel="shortcut icon" href="favicon.png" type="image/png">
<link rel="stylesheet" type="text/css" media="all" href="fancybox/jquery.fancybox.css">
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="fancybox/jquery.fancybox.js"></script>


<script type="text/javascript" src="js/jquery.maskedinput.js"></script>
<script type="text/javascript">
jQuery(function($){
$("#phone").mask("+7 (999) 999-9999");
$("#phone2").mask("+7 (999) 999-9999");
});
</script>
<script type="text/javascript">
var image_count = 2;
var interval = 13000;
var time_out = 30;
var i = 0;
var timeout;
var opacity = 100;

function change_image() {
opacity--;
var j = i + 1;
var current_image = 'img_' + i;
if (i == image_count) j = 1;
var next_image = 'img_' + j;
document.getElementById(current_image).style.opacity=opacity/100;
document.getElementById(current_image).style.filter='alpha(opacity='+opacity+')';
document.getElementById(next_image).style.opacity=(100-opacity)/100;
document.getElementById(next_image).style.filter='alpha(opacity='+(100-opacity)+')';
timeout = setTimeout("change_image()", time_out);
if (opacity==1) {
opacity = 100;
clearTimeout(timeout);
}
}

setInterval (function() {i++; if (i>image_count) i=1; change_image();}, interval);
</script>
<style type="text/css">
<!--
body,td,th {
font-size: 100%;
}
-->
</style></head>

<div href="#inline" class="modalbox">Задать вопрос</div>
<div id="inline">
<h2>Онлайн заявка</h2>
<form id="contact" action="#" method="post" name="contact">
<input id="name" class="txt" name="name" type="name" placeholder="Ваше имя">
<input id="phone" class="txt" name="phone" type="phone" placeholder="Ваш телефон">
<input id="email" class="txt" name="email" type="email" placeholder="Ваш e-mail">
<textarea id="msg" class="txtarea" name="msg" placeholder="Ваше сообщение:"></textarea>
<button id="send">Отправить</button>
</form>
</div>






<div id="maincontent">

<div><img src="img/logo.jpg"></div>
<div class="zvezda"><a href="" title="Переход на главную страницу"><img src="img/zvezda.jpg"></a></div>


<div class="menu">
<div id="sp1"><span class="textnov2">Главная страница</span></div>
<div><a href="news.html"><div id="sp2"><span class="textnov">Новости</span></div></a></div>
<div><a href="service.html"><div id="sp3"><span class="textnov">Услуги</span></div></a></div>
<div><a href="page.html"><div id="sp4"><span class="textnov">Прайс на услуги</span></div></a></div>
<div><a href="articles.html"><div id="sp5"><span class="textnov">Статьи</span></div></a></div>
<div><a href="contacts.html"><div id="sp6"><span class="textnov">Контакты</span></div></a></div>
<div><a href="bonus.html"><div id="sp7"><span class="textnov" id="podser">Подарочные<br>сертификаты</span></div></a></div>
<div><a href="poisk.html"><div id="sp8"><span class="textnov">Поиск</span></div></a></div>
<div><a href="portfolio.html"><div id="sp9"><span class="textnov">Наши работы</span></div></a></div>
<div><a href="vacancy.html"><div id="sp10"><span class="textnov">Вакансии</span></div></a></div>
</div>


<div class="podmenu">
<div><a href="index-1.html"><img src="img/podmenu/podmenu1.jpg" class="podmenu1"></a></div>
<div><a href="index-1.html"><img src="img/podmenu/podmenu2.jpg" class="podmenu1"></a></div>
<div><a href="index-1.html"><img src="img/podmenu/podmenu3.jpg" class="podmenu1"></a></div>
</div>

<div class="reklama">
<div><a href="http://topzrenie.ru/?utm_medium=cpc&utm_source=marketgid&utm_campaign=TopZrenie&utm_term=56919641&utm_content=51963001"><img src="img/reklama/reklama1.jpg"></a></div>
<div><a href="http://topzrenie.ru/?utm_medium=cpc&utm_source=marketgid&utm_campaign=TopZrenie&utm_term=56919641&utm_content=51982726"><img src="img/reklama/reklama2.jpg"></a></div>
<div><a href="http://apple-2017.ru/t/?utm_medium=cpc&utm_source=Tovarro&utm_campaign=6s-inmag&utm_term=56919641&utm_content=51540467"><img src="img/reklama/reklama3.jpg"></a></div>
<div><a href="http://obzor-news.com/tech/adaptiv/?i=1&voluumdata=BASE64dmlkLi4wMDAwMDAwMy03MDY4LTQ1N2YtODAwMC0wMDAwMDAwMDAwMDBfX3ZwaWQuLmM3MmViODAwLWY3OWUtMTFlNi04MjAzLTgxZmMwOTZmOWQyOF9fY2FpZC4uMzUwMmQ1MzEtNWU0Mi00ZjNkLWE3OGMtNTY0NTZhM2EzODE4X19ydC4uUl9fbGlkLi45NjFjMDVjMi0zODMxLTQwNTUtOGJjMC1mMmQ2MGZmYWVjOTZfX29pZDEuLjE5YzlkNTI2LWYzZjQtNDliNS04NTcxLTRjYjBkYzM2NGUzZF9fdmFyMS4uNTIzODY4NTZfX3ZhcjIuLjU2OTE5NjQxX192YXIzLi4xNTY4MjZfX3ZhcjYuLk1hcmtldGdpZF9fdmFyOS4udHJcX1xtZ1xfXGlzXF9cbmV3c1xfXGRlc2tfX3JkLi53d3dcLlxtYXJrZXRnaWRcLlxjb21fX2FpZC4uX19hYi4uX19zaWQuLg&utm_content=52386856&utm_term=56919641&utm_campaing=156826&utm_source=Marketgid&c9=tr_mg_is_news_desk"><img src="img/reklama/reklama4.jpg"></a></div>
</div>

<div class="galer">
<img src='img/glavnaya/glavnaya1.jpg' id="img_1" style="position: absolute;">
<img src='img/glavnaya/glavnaya2.jpg' id="img_2" style="opacity: 0; filter: alpha(opacity=0);
position: absolute;">
</div>



<div class="img2">
<ul class="iul">
<li class="iul2">
<a href="s-1-iyulya-u-nas-novye-lampy-v-solyarii.html" title="С 1 ИЮЛЯ у нас новые лампы в солярии!!!">
<span>С 1 ИЮЛЯ у нас новые лампы в…</span>
</a>
<p class="feed-item-description">Уважаемые клиенты салона красоты "Меланж". Специально для Вас мы произвели замену ламп в вертикальном солярии. Загорайте с удовольствием!</p>
</li>
</ul>
</div>

<div class="img3"><img src="img/imgcontent/imgcontent2.jpg"></div>

<div class="img4"><img src="img/imgcontent/imgcontent3.jpg"></div>

<div class="img5"><img src="img/imgcontent/imgcontent4.jpg"></div>

</div>

<div class="nizfon">
<div class="footer3">Мы в социальных социальных сетях:
<div class="imgsoc"><a href="https://www.facebook.com/" title="Фейсбук"><img src="img/Facebook.PNG"></a></div>
<div class="imgsoc2"><a href="https://twitter.com/" title="Твиттер"><img src="img/Twitter.PNG"></a></div>
<div class="imgsoc3"><a href="https://www.google.com/" title="Гугл"><img src="img/Google.PNG"></a></div>
<div class="imgsoc4"><a href="https://ok.ru/" title="Однокласники"><img src="img/ok.PNG"></a></div>
<div class="imgsoc5"><a href="https://vk.com/" title="В контакте"><img src="img/vkon.PNG"></a></div>



</div>
<div class="footer">©</div><a href="http://www.setup.ru" target="_blank" class="block-type-siteinfo">Конструктор сайтов Setup</a>

<div class="block-text">
<p class="footer2">Салон - Красоты "Звезда в Шоке" - мы ждем Вас!</p>
<p class="footer2" >г. Ярославль, ул. Магистральная, дом 2 (вход со двора)</p>
<p class="footer2">8(920)128-75-00</p>
<p class="footer2">8(920)567-32-22</p>
<p class="footer2">Стрижка. Маникюр. Педикюр. Массаж. Солярий. Укладка.<br> Окрашивание.&nbsp;</p>
</div>

<div class="block-text2">
<p><span class="accenter">Телефон для записи</span></p>
<p><span class="accenter">8(920)128-75-00</span></p>
<p><span class="accenter">8(920)567-32-22</span></p>
<p><span class="accenter"><strong style="color: #adadab; font-size: 13px; line-height: 15.5520000457764px; text-align: center;"><span style="font-size: large; color: #339966;"><span class="accenter">&nbsp;</span></span></strong></span></p>
</div>
<div class="schetchik"><img src="img/schetchik.jpg"></div>

<div class="setup-bottom-panel">
<div class="setup-bottom-panel--container">
<a href="http://setup.ru/?utm_campaign=plashka&amp;utm_medium=fix&amp;utm_source=portfolio" class="setup-bottom-panel--txt" target="_blank" onclick="ga('send', 'event', 'link_setup', 'click_link_setup');">Сайт создан на Setup.ru</a>
<a href="http://setup.ru/?utm_campaign=plashka&amp;utm_medium=fix&amp;utm_source=portfolio" class="setup-bottom-panel--button" target="_blank" onclick="ga('send', 'event', 'link_setup', 'click_link_setup');">Создать сайт бесплатно</a>
<a href="http://setup.ru/?utm_campaign=plashka&amp;utm_medium=fix&amp;utm_source=portfolio" class="setup-bottom-panel--logo" target="_blank" onclick="ga('send', 'event', 'link_setup', 'click_link_setup');"></a>
</div>
</div>

</div>

<script type="text/javascript">
function validateEmail(email) {
var reg = /^[^\s()<>@,;:\/]+@\w[\w\.-]+\.[a-z]{2,}$/i;
return reg.test(email);
}
$(document).ready(function() {
$(".modalbox").fancybox();
$("#contact").submit(function() { return false; });

$("#send").on("click", function(){

var emailval = $("#email").val();
var namevl = $("#name").val();
var phonevl = $("#phone").val();
var msgval = $("#msg").val();
var msglen = msgval.length;
var mailvalid = validateEmail(emailval);

// check mail
if(mailvalid == false) {
$("#email").addClass('error');
}else{
$("#email").removeClass('error');
}

// check name
if(namevl == false) {
$("#name").addClass('error');
}else{
$("#name").removeClass('error');
}

// check phone
if(phonevl == false) {
$("#phone").addClass('error');
}else{
$("#phone").removeClass('error');
}

// check len msg
if(msglen < 4) {
$("#msg").addClass('error');
}else{
$("#msg").removeClass('error');
}



if(mailvalid == true && msglen >= 4 && namevl != false && phonevl != false ) {
// если обе проверки пройдены
// сначала мы скрываем кнопку отправки
$("#send").replaceWith("<em>отправить...</em>");
$.ajax({
type: 'POST',
url: 'sendmessage.php',
data: $("#contact").serialize(),
success: function(data) {
if(data == "true") {
$("#contact").fadeOut("fast", function(){
$(this).before("<p><strong>Успешно! Ваше сообщение отправлено :)</strong></p>");
setTimeout("$.fancybox.close()", 1000);
});
}
}
});
}
});
});
</script>

</body>

</html>



Код:
@charset "windows-1251";
/* CSS Document */



body {
  font-family: 'Palatino Linotype', serif;
  padding: 0px 30px;
  }

h1 {
  margin-bottom: 0px;
}

p {
  margin-top: 0px;
}

fieldset {
  margin-bottom: 15px;
  padding: 10px;
}

legend {
  padding: 0px 3px;
  font-weight: bold;
  font-variant: small-caps;
}

label {
  width: 110px;
  display: inline-block;
  vertical-align: top;
  margin: 6px;
}

em {
  font-weight: bold;
  font-style: normal;
  color: #f00;
}

input:focus {
  background: #eaeaea;
}

input, textarea {
  width: 249px;
}

textarea {
  height: 100px;
}

select {
  width: 254px;
}

input[type=checkbox] {
  width: 10px;
}

input[type=submit] {
  width: 170px;
  padding: 10px;
}

body, p, div{
	padding: 0px;
	margin:0px;
	line-height: 1.2;
	color: #333333 !important;
	font-family: Arial, Helvetica, sans-serif !important;
}

#maincontent{
	height: 1550px;
	background-color:#ecede7;
	
}

.menu{
	margin-left:250px;
	margin-top:10px;
}

.men1{
	
	margin-top:10px;
	
}

#sp1{
	width:241px;
	height:48px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 498px;
	display:inline-block;
	
}

#sp2{
	width:241px;
	height:48px;
	background-image: url(img/menu2.jpg);
	background-position:0px 450px;
	display:inline-block;
	
}

#sp2:hover{
	width:241px;
	height:48px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 450px;
}

#sp3{
	width:241px;
	height:48px;
	background-image: url(img/menu2.jpg);
    background-position:0px 402px;
	display:inline-block;
	
}

#sp3:hover{
	width:241px;
	height:48px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 402px;
}

#sp4{
	width:241px;
	height:47px;
	background-image: url(img/menu2.jpg);
    background-position:0px 355px;
	display:inline-block;
	
}

#sp4:hover{
	width:241px;
	height:47px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 355px;
}

#sp5{
	width:241px;
	height:48px;
	background-image: url(img/menu2.jpg);
    background-position:0px 307px;
	display:inline-block;
	
}

#sp5:hover{
	width:241px;
	height:48px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 307px;
}

#sp6{
	width:241px;
	height:48px;
	background-image: url(img/menu2.jpg);
    background-position:0px 259px;
	display:inline-block;
	
}

#sp6:hover{
	width:241px;
	height:48px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 259px;
}

#sp7{
	width:241px;
	height:67px;
	background-image: url(img/menu2.jpg);
    background-position:0px 211px;
	display:inline-block;
	
}

#sp7:hover{
	width:241px;
	height:67px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 211px;
}

#sp8{
	width:241px;
	height:48px;
	background-image: url(img/menu2.jpg);
    background-position:0px 143px;
	display:inline-block;
	
}

#sp8:hover{
	width:241px;
	height:48px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 143px;
}

#sp9{
	width:241px;
	height:48px;
	background-image: url(img/menu2.jpg);
    background-position:0px 95px;
	display:inline-block;
	
}

#sp9:hover{
	width:241px;
	height:48px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 95px;
}

#sp10{
	width:241px;
	height:48px;
	background-image: url(img/menu2.jpg);
    background-position:0px 50px;
	display:inline-block;
	
}

#sp10:hover{
	width:241px;
	height:48px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 50px;
}

.podmenu{
	margin-left:250px;
	padding:10px 0px 0px 0px;
}

.podmenu1{
	margin-bottom:10px;
}

.reklama{
	margin-left:250px;
	padding:10px 0px 0px 0px;
}

.img1{
	margin-left:750px;
	margin-top:-1110px;
}

.img2{
	background-image:url(img/modul.jpg);
	width:670px;
	height:140px;
	margin-left:500px;
	margin-top: 10px;
	font-size:12px;
}

.img3{
	margin-left:500px;
	margin-top:5px;
}

.img4{
	float:left;
	margin-left:840px;
	margin-top:-355px;
}

.img5{
	margin-left:500px;
	margin-top:5px;
}

.ssilka{
	font-size:18px;
	margin-left:200px;
	padding-top:30px;
}

.nizfon{
	padding-top:25px;
	height:210px;
	width: 1920px;
	background-image:url(img/nizfon.jpg);
	border-top: 2px solid #9BC550;
    background: #3C3E37;
    color: #ACADAB !important;
}

.block-type-siteinfo {
	margin-left:5px;
	display:inline-block;
    font-size: 0.8em;
	color: #9BC550 !important;
}

.footer {
	margin-left:250px;
	margin-top:10px;
	display:inline-block;
    background: #3C3E37;
    color: #ACADAB !important;
}

.block-text {
	margin-left: 250px;
    margin-top: -25px;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 90%;
    vertical-align: baseline;
    background: transparent;
	color: #ACADAB !important;
}

.footer2{
	padding-top:0px;
	margin-left: 275px;
	margin-top:0px;
	color: #ACADAB !important;
}

.footer3{
	position: absolute;
	height:auto;
	width:auto;
	padding-top:0px;
	;
	margin-top:10px;
	color: #ACADAB !important;
}

.imgsoc{
	margin-left: 0px;
	margin-top: 10px;
	}

.imgsoc2{
	margin-left: 65px;
	margin-top: -65px;
	}
	
.imgsoc3{
	margin-left: 130px;
	margin-top: -65px;
	}
	
.imgsoc4{
	margin-left: 195px;
	margin-top: -65px;
	}
	
.imgsoc5{
	margin-left: 260px;
	margin-top: -65px;
	}

.accenter{
	font-size: 1.25em;
    font-weight: normal;
    color: #FFF !important;
	}
	


.block-text2{
	margin-top:-140px;
}

.gallery-collection-type-pix .gallery-collection-item-img {
    width: 154px;
    display: block;
}

.block-type-counters {
    padding: 10px 0 0;
}
.block-type-counters {
}
.block {
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.cleared::after, .block-content::after, .block-type-catalogitem::after {
    content: '';
    display: block;
    clear: both;
}
элемент {
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.block-text {
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.block-type-counters-counter {
    display: inline-block;
    max-width: 88px;
    max-height: 150px;
    overflow: hidden;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

#footer A {
    color: #9BC550 !important;
}
a, .pseudo-link {
    color: #990000 !important;
}
A {
    color: #00659B;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.block-type-counters-counter IMG, .block-text .block-type-counters-counter IMG {
    float: none;
    border: none;
    margin: 0;
}
.block-text IMG {
    margin-right: 10px;
}
.block-text IMG {
    max-width: 100%;
}
.block-text IMG {
    border: 1px solid #DCDCDC;
    margin: 0 16px 10px 0;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.block-type-counters-counter {
    display: inline-block;
    max-width: 88px;
    max-height: 150px;
    overflow: hidden;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

#footer A {
    color: #9BC550 !important;
}
a, .pseudo-link {
    color: #990000 !important;
}
A {
    color: #00659B;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.setup-bottom-panel {
    position: fixed;
    z-index: 999;
    width: 1210px;
    bottom: 0;
    height: 25px;
    font-family: PT Sans, Arial, Tahoma, sans-serif;
    background-image: linear-gradient(-180deg, rgba(77,77,77,0.69) 4%, 			      	    rgba(45,45,45,0.69) 99%);
    box-shadow: 0px -2px 20px 0px rgba(0,0,0,0.40);
	margin-left:0px;
}

.setup-bottom-panel--txt, .setup-bottom-panel--txt:hover {
    color: #fff !important;
}
.setup-bottom-panel--txt {
    display: inline-block;
    font-size: 12px;
    color: #ffffff;
    text-align: right;
    line-height: 25px;
    position: absolute;
    bottom: 0px;
    left: 250px;
    text-decoration: none;
}

.setup-bottom-panel--button, .setup-bottom-panel--button:hover {
    color: #000 !important;
}
.setup-bottom-panel--button {
    display: inline-block;
    background-image: linear-gradient(0deg, #faa946 0%, #fac346 97%);
    box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.30), inset 1px 2px 1px 0px   	   rgba(255,255,255,0.30);
    width: 195px;
    height: 25px;
    font-size: 14px;
    color: #000;
    line-height: 25px;
    text-shadow: 0px 1px 0px rgba(255,255,255,0.35);
    text-align: center;
    text-decoration: none;
	margin-left:700px;
}

.setup-bottom-panel--logo {
    content: ' ';
    display: inline-block;
    height: 40px;
    width: 55px;
    background-image: url(img/imgcontent/imgstr6/bukvau.png);
    background-repeat: no-repeat;
    background-size: 56px;
    position: absolute;
    bottom: 0px;
    right: 0px;
}

.textnov{
	text-shadow: 0 -1px rgba(0,0,0,0.4);
    color: #FFF !important;
	font-size: 1.15em;
    font-weight: bold;
	position: absolute;
	margin-top: 10px;
	margin-left: 20px;
}

.textnov2{
	text-shadow: 0 -1px rgba(0,0,0,0.4);
	color: #FFF !important;
	font-size: 1.15em;
	font-weight: bold;
	position: absolute;
	margin-top: 10px;
	margin-left: 20px;
}

.cleared::after, .block-content::after, .block-type-catalogitem::after {
    content: '';
    display: block;
    clear: both;
}

.block-feed-view-variant-imglarge .feed-items {
    padding-left: 0;
    margin-right: -20px;
    text-align: center;
	}
.block-type-feedimg .feed-items {
    padding: 1em 0 0;
    padding-left: 0px;
    line-height: 1.3;
}
OL, UL {
    list-style: none;
	width:300px;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
        margin-right: 0px;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.block-type-feedimg .feed-items LI, .block-feed-view-variant-imglarge .feed-items LI.feed-item-1, .block-feed-view-variant-imgsmall .feed-items LI.feed-item-1 {
    margin-right: 20px;
}
.block-feed-view-variant-imglarge .feed-items LI.feed-item-1 {
    margin: 0 10px -1px 0;
}
.block-feed-view-variant-imglarge .feed-items LI {
    width: 300px;
    max-height: 300px;
    margin-right: 0;
}
.block-type-feedimg .feed-items LI {
    float: left;
    margin: 0 6px 20px 0;
    margin-right: 6px;
    width: 140px;
    min-height: 80px;
    overflow: hidden;
    vertical-align: top;
    display: inline-block;
    text-align: left;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.block-type-feedimg .feed-items A {
    text-decoration: none;
}
a, .pseudo-link {
    color: #990000 !important;
}
A {
    color: #00659B;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.block-feed-view-variant-imglarge .feed-items A SPAN {
    height: 1.2em;
}
.block-type-feedimg .feed-items A SPAN {
    display: block;
    overflow: hidden;
    margin: 0 0 4px;
    text-decoration: underline;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin:0;
    padding:0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: transparent;
	line-height:1.5;
}

.iul{
	margin-left:200px;
	padding-top:30px;
	}

#podser{
	line-height:1.1;
}	

.schetchik{
	margin-left:952px;
	margin-top:-10px;
}

.zvezda{
	position:absolute;
	margin-left:250px;
	margin-top:-365px;
}

.feedback {
    
}

.feedback {
   
}

.modalbox {
	border-radius: 10px !important; /* Уголки */
	background-color: #000066 !important;
    color: #ffffff !important;
	top: 300px;
    position: fixed;
	font: bold 16px/40px Arial, Helvetica, sans-serif;
    left: -75.5px;
    display: block;
    cursor: pointer;
    padding: 10px 11px;
    font-size: 1.2em;
    border: solid 1px #F9F9F9;
    width: 150px !important;
    text-decoration: none;
    text-align: center;
    margin:0 auto 20px;
	 -moz-border-radius: 0 0 10px 10px;
    -webkit-border-radius: 0 0 100px 10px;
    border-radius: 0 0 10px 10px;
    -moz-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
}

/* Форма обратной связи */
#inline {
    display:none;
    margin-left: 30px;
    width: 700px;
	height:410px;
    margin: 0 auto;
    background: #fff;
    padding: 10px 20px;
}
.txt { 
    display: inline-block;
    color: #676767;
    width: 190px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 5px 9px;
    font-size: 15px!important;
    line-height: 1.4em;
}
.txtarea { 
    display: inline-block;
    color: #676767;
    width: 617px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 5px 9px;
    font-size: 15px!important;
    line-height: 1.4em;
    height: 80px;
}
.txt:focus, .txtarea:focus {
 border-style: solid; 
 border-color: #bababa; 
 color: #444; 
 }
input.error, textarea.error { 
    border-color: #973d3d; 
    border-style: solid; 
    background: #f0bebe; 
    color: #a35959; 
    }
input:focus, textarea:focus{ 
    border-color: blue; 
    border-style: solid; 
    background: white; 
    color: #a35959; 
    }

#send { 
    color: #FFFFFF;
    display: block;
    cursor: pointer;
    padding: 5px 11px;
    font-size: 1.2em;
    border: solid 1px #F9F9F9;
    border-radius: 2px;
    background: #70C6B9;
    width: 210px;
    margin-bottom: 20px;
}

#send2 { 
    color: #FFFFFF;
    display: block;
    cursor: pointer;
    padding: 5px 11px;
    font-size: 1.2em;
    border: solid 1px #F9F9F9;
    border-radius: 2px;
    background: #70C6B9;
    width: 210px;
    margin-bottom: 20px;
	margin-left:230px;
	margin-top:-53px;
}

#send:hover {
    background: #979797;
}

#send2:hover {
    background: #979797;
}

.galer{
	width: 830px;
	height: 210px;
	margin-left:500px;
	margin-top:-1110px;
	}
Pavl сказал(а):
Код:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html style="width: 1920px;">
<body>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<link rel="stylesheet" href="style113.css">
<link rel="stylesheet" href="normalize.css">
<title>Главная</title>
<link rel="shortcut icon" href="favicon.png" type="image/png">
<link rel="stylesheet" type="text/css" media="all" href="fancybox/jquery.fancybox.css">
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="fancybox/jquery.fancybox.js"></script>


 <script type="text/javascript" src="js/jquery.maskedinput.js"></script>
 <script type="text/javascript">
jQuery(function($){
   $("#phone").mask("+7 (999) 999-9999");
   $("#phone2").mask("+7 (999) 999-9999");
});
</script>
<script type="text/javascript">
var image_count = 2;
var interval = 13000;
var time_out = 30;
var i = 0;
var timeout;
var opacity = 100;

function change_image() {
 opacity--;
 var j = i + 1;
 var current_image = 'img_' + i;
 if (i == image_count) j = 1;
 var next_image = 'img_' + j;
 document.getElementById(current_image).style.opacity=opacity/100;
 document.getElementById(current_image).style.filter='alpha(opacity='+opacity+')';
 document.getElementById(next_image).style.opacity=(100-opacity)/100;
 document.getElementById(next_image).style.filter='alpha(opacity='+(100-opacity)+')';
 timeout = setTimeout("change_image()", time_out);
 if (opacity==1) {
  opacity = 100;
  clearTimeout(timeout);
 }
}

setInterval (function() {i++; if (i>image_count) i=1; change_image();}, interval);
</script>
<style type="text/css">
<!--
body,td,th {
	font-size: 100%;
}
-->
</style></head>

	<div  href="#inline"  class="modalbox">Задать вопрос</div>
        <div id="inline">
<h2>Онлайн заявка</h2>
<form id="contact" action="#" method="post" name="contact">
<input id="name" class="txt" name="name" type="name" placeholder="Ваше имя">
<input id="phone" class="txt" name="phone" type="phone" placeholder="Ваш телефон"> 
<input id="email" class="txt" name="email" type="email" placeholder="Ваш e-mail"> 
<textarea id="msg" class="txtarea" name="msg" placeholder="Ваше сообщение:"></textarea>
<button id="send">Отправить</button>
  </form>
  </div>
   

  


 
<div id="maincontent">

	<div><img src="img/logo.jpg"></div>
    <div class="zvezda"><a href="" title="Переход на главную страницу"><img src="img/zvezda.jpg"></a></div>

    
   <div class="menu">
            <div id="sp1"><span class="textnov2">Главная страница</span></div>
            <div><a href="news.html"><div id="sp2"><span class="textnov">Новости</span></div></a></div>
            <div><a href="service.html"><div id="sp3"><span class="textnov">Услуги</span></div></a></div>
            <div><a href="page.html"><div id="sp4"><span class="textnov">Прайс на услуги</span></div></a></div>
            <div><a href="articles.html"><div id="sp5"><span class="textnov">Статьи</span></div></a></div>
            <div><a href="contacts.html"><div id="sp6"><span class="textnov">Контакты</span></div></a></div>
            <div><a href="bonus.html"><div id="sp7"><span class="textnov" id="podser">Подарочные<br>сертификаты</span></div></a></div>
            <div><a href="poisk.html"><div id="sp8"><span class="textnov">Поиск</span></div></a></div>
            <div><a href="portfolio.html"><div id="sp9"><span class="textnov">Наши работы</span></div></a></div>
            <div><a href="vacancy.html"><div id="sp10"><span class="textnov">Вакансии</span></div></a></div>
    </div>

    
    <div class="podmenu">
    	<div><a href="index-1.html"><img src="img/podmenu/podmenu1.jpg" class="podmenu1"></a></div>
        <div><a href="index-1.html"><img src="img/podmenu/podmenu2.jpg" class="podmenu1"></a></div>
        <div><a href="index-1.html"><img src="img/podmenu/podmenu3.jpg" class="podmenu1"></a></div>
    </div>
    
    <div class="reklama">
    	<div><a href="http://topzrenie.ru/?utm_medium=cpc&utm_source=marketgid&utm_campaign=TopZrenie&utm_term=56919641&utm_content=51963001"><img src="img/reklama/reklama1.jpg"></a></div>
        <div><a href="http://topzrenie.ru/?utm_medium=cpc&utm_source=marketgid&utm_campaign=TopZrenie&utm_term=56919641&utm_content=51982726"><img src="img/reklama/reklama2.jpg"></a></div>
        <div><a href="http://apple-2017.ru/t/?utm_medium=cpc&utm_source=Tovarro&utm_campaign=6s-inmag&utm_term=56919641&utm_content=51540467"><img src="img/reklama/reklama3.jpg"></a></div>
        <div><a href="http://obzor-news.com/tech/adaptiv/?i=1&voluumdata=BASE64dmlkLi4wMDAwMDAwMy03MDY4LTQ1N2YtODAwMC0wMDAwMDAwMDAwMDBfX3ZwaWQuLmM3MmViODAwLWY3OWUtMTFlNi04MjAzLTgxZmMwOTZmOWQyOF9fY2FpZC4uMzUwMmQ1MzEtNWU0Mi00ZjNkLWE3OGMtNTY0NTZhM2EzODE4X19ydC4uUl9fbGlkLi45NjFjMDVjMi0zODMxLTQwNTUtOGJjMC1mMmQ2MGZmYWVjOTZfX29pZDEuLjE5YzlkNTI2LWYzZjQtNDliNS04NTcxLTRjYjBkYzM2NGUzZF9fdmFyMS4uNTIzODY4NTZfX3ZhcjIuLjU2OTE5NjQxX192YXIzLi4xNTY4MjZfX3ZhcjYuLk1hcmtldGdpZF9fdmFyOS4udHJcX1xtZ1xfXGlzXF9cbmV3c1xfXGRlc2tfX3JkLi53d3dcLlxtYXJrZXRnaWRcLlxjb21fX2FpZC4uX19hYi4uX19zaWQuLg&utm_content=52386856&utm_term=56919641&utm_campaing=156826&utm_source=Marketgid&c9=tr_mg_is_news_desk"><img src="img/reklama/reklama4.jpg"></a></div>
    </div>
    
    <div class="galer">
<img src='img/glavnaya/glavnaya1.jpg' id="img_1" style="position: absolute;">
<img src='img/glavnaya/glavnaya2.jpg' id="img_2" style="opacity: 0; filter: alpha(opacity=0);
    position: absolute;">
    </div>

    
    
    <div class="img2">
    		<ul class="iul">
            <li class="iul2">
                        <a href="s-1-iyulya-u-nas-novye-lampy-v-solyarii.html" title="С 1 ИЮЛЯ у нас новые лампы в солярии!!!">
                            <span>С 1 ИЮЛЯ у нас новые лампы в…</span>
                        </a>
                        <p class="feed-item-description">Уважаемые клиенты салона красоты "Меланж". Специально для Вас мы произвели замену ламп в вертикальном солярии. Загорайте с удовольствием!</p>
                </li>
            </ul>
    </div>
    
    <div class="img3"><img src="img/imgcontent/imgcontent2.jpg"></div>
    
    <div class="img4"><img src="img/imgcontent/imgcontent3.jpg"></div>
    
    <div class="img5"><img src="img/imgcontent/imgcontent4.jpg"></div>
    
</div>

   <div class="nizfon">
        <div class="footer3">Мы в социальных социальных сетях:
        	<div class="imgsoc"><a href="https://www.facebook.com/" title="Фейсбук"><img src="img/Facebook.PNG"></a></div>
            <div class="imgsoc2"><a href="https://twitter.com/" title="Твиттер"><img src="img/Twitter.PNG"></a></div>
            <div class="imgsoc3"><a href="https://www.google.com/" title="Гугл"><img src="img/Google.PNG"></a></div>
            <div class="imgsoc4"><a href="https://ok.ru/" title="Однокласники"><img src="img/ok.PNG"></a></div>
            <div class="imgsoc5"><a href="https://vk.com/" title="В контакте"><img src="img/vkon.PNG"></a></div>



        </div>
   		<div class="footer">©</div><a href="http://www.setup.ru" target="_blank" class="block-type-siteinfo">Конструктор сайтов Setup</a>
        
        <div class="block-text">
                <p class="footer2">Салон - Красоты "Звезда в Шоке" - мы ждем Вас!</p>
<p class="footer2" >г. Ярославль, ул. Магистральная, дом 2 (вход со двора)</p>
<p class="footer2">8(920)128-75-00</p>
<p class="footer2">8(920)567-32-22</p>
<p class="footer2">Стрижка. Маникюр. Педикюр. Массаж. Солярий. Укладка.<br> Окрашивание.&nbsp;</p>
         </div>
         
         <div class="block-text2">
                <p><span class="accenter">Телефон для записи</span></p>
<p><span class="accenter">8(920)128-75-00</span></p>
<p><span class="accenter">8(920)567-32-22</span></p>
<p><span class="accenter"><strong style="color: #adadab; font-size: 13px; line-height: 15.5520000457764px; text-align: center;"><span style="font-size: large; color: #339966;"><span class="accenter">&nbsp;</span></span></strong></span></p>
          </div>
          <div class="schetchik"><img src="img/schetchik.jpg"></div>
          
          <div class="setup-bottom-panel">
                    <div class="setup-bottom-panel--container">
                        <a href="http://setup.ru/?utm_campaign=plashka&amp;utm_medium=fix&amp;utm_source=portfolio" class="setup-bottom-panel--txt" target="_blank" onclick="ga('send', 'event', 'link_setup', 'click_link_setup');">Сайт создан на Setup.ru</a>
                        <a href="http://setup.ru/?utm_campaign=plashka&amp;utm_medium=fix&amp;utm_source=portfolio" class="setup-bottom-panel--button" target="_blank" onclick="ga('send', 'event', 'link_setup', 'click_link_setup');">Создать сайт бесплатно</a>
                        <a href="http://setup.ru/?utm_campaign=plashka&amp;utm_medium=fix&amp;utm_source=portfolio" class="setup-bottom-panel--logo" target="_blank" onclick="ga('send', 'event', 'link_setup', 'click_link_setup');"></a>
                    </div>
   </div>

</div>

<script type="text/javascript">
	function validateEmail(email) {
		var reg = /^[^\s()<>@,;:\/]+@\w[\w\.-]+\.[a-z]{2,}$/i;
		return reg.test(email);
	}
	$(document).ready(function() {
	$(".modalbox").fancybox();
	$("#contact").submit(function() { return false; });
	
	$("#send").on("click", function(){
		
		var emailval  = $("#email").val();
		var namevl  = $("#name").val();
		var phonevl  = $("#phone").val();
		var msgval    = $("#msg").val();
		var msglen    = msgval.length;
		var mailvalid = validateEmail(emailval);

		// check mail
		if(mailvalid == false) {
			$("#email").addClass('error');
		}else{
			$("#email").removeClass('error');
		}

		// check name
		if(namevl == false) {
			$("#name").addClass('error');
		}else{
			$("#name").removeClass('error');
		}
		
		// check phone
		if(phonevl == false) {
			$("#phone").addClass('error');
		}else{
			$("#phone").removeClass('error');
		}
		
		// check len msg
		if(msglen < 4) {
			$("#msg").addClass('error');
		}else{
			$("#msg").removeClass('error');
		}

	
		
		if(mailvalid == true && msglen >= 4 && namevl != false && phonevl != false ) {
			// если обе проверки пройдены
			// сначала мы скрываем кнопку отправки
			$("#send").replaceWith("<em>отправить...</em>");
			$.ajax({
				type: 'POST',
				url: 'sendmessage.php',
				data: $("#contact").serialize(),
				success: function(data) {
					if(data == "true") {
						$("#contact").fadeOut("fast", function(){
							$(this).before("<p><strong>Успешно! Ваше сообщение отправлено  :)</strong></p>");
							setTimeout("$.fancybox.close()", 1000);
						});
					}
				}
			});
		}
	});
});
</script>

</body>

</html>
Код:
@charset "windows-1251";
/* CSS Document */



body {
  font-family: 'Palatino Linotype', serif;
  padding: 0px 30px;
  }

h1 {
  margin-bottom: 0px;
}

p {
  margin-top: 0px;
}

fieldset {
  margin-bottom: 15px;
  padding: 10px;
}

legend {
  padding: 0px 3px;
  font-weight: bold;
  font-variant: small-caps;
}

label {
  width: 110px;
  display: inline-block;
  vertical-align: top;
  margin: 6px;
}

em {
  font-weight: bold;
  font-style: normal;
  color: #f00;
}

input:focus {
  background: #eaeaea;
}

input, textarea {
  width: 249px;
}

textarea {
  height: 100px;
}

select {
  width: 254px;
}

input[type=checkbox] {
  width: 10px;
}

input[type=submit] {
  width: 170px;
  padding: 10px;
}

body, p, div{
	padding: 0px;
	margin:0px;
	line-height: 1.2;
	color: #333333 !important;
	font-family: Arial, Helvetica, sans-serif !important;
}

#maincontent{
	height: 1550px;
	background-color:#ecede7;
	
}

.menu{
	margin-left:250px;
	margin-top:10px;
}

.men1{
	
	margin-top:10px;
	
}

#sp1{
	width:241px;
	height:48px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 498px;
	display:inline-block;
	
}

#sp2{
	width:241px;
	height:48px;
	background-image: url(img/menu2.jpg);
	background-position:0px 450px;
	display:inline-block;
	
}

#sp2:hover{
	width:241px;
	height:48px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 450px;
}

#sp3{
	width:241px;
	height:48px;
	background-image: url(img/menu2.jpg);
    background-position:0px 402px;
	display:inline-block;
	
}

#sp3:hover{
	width:241px;
	height:48px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 402px;
}

#sp4{
	width:241px;
	height:47px;
	background-image: url(img/menu2.jpg);
    background-position:0px 355px;
	display:inline-block;
	
}

#sp4:hover{
	width:241px;
	height:47px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 355px;
}

#sp5{
	width:241px;
	height:48px;
	background-image: url(img/menu2.jpg);
    background-position:0px 307px;
	display:inline-block;
	
}

#sp5:hover{
	width:241px;
	height:48px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 307px;
}

#sp6{
	width:241px;
	height:48px;
	background-image: url(img/menu2.jpg);
    background-position:0px 259px;
	display:inline-block;
	
}

#sp6:hover{
	width:241px;
	height:48px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 259px;
}

#sp7{
	width:241px;
	height:67px;
	background-image: url(img/menu2.jpg);
    background-position:0px 211px;
	display:inline-block;
	
}

#sp7:hover{
	width:241px;
	height:67px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 211px;
}

#sp8{
	width:241px;
	height:48px;
	background-image: url(img/menu2.jpg);
    background-position:0px 143px;
	display:inline-block;
	
}

#sp8:hover{
	width:241px;
	height:48px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 143px;
}

#sp9{
	width:241px;
	height:48px;
	background-image: url(img/menu2.jpg);
    background-position:0px 95px;
	display:inline-block;
	
}

#sp9:hover{
	width:241px;
	height:48px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 95px;
}

#sp10{
	width:241px;
	height:48px;
	background-image: url(img/menu2.jpg);
    background-position:0px 50px;
	display:inline-block;
	
}

#sp10:hover{
	width:241px;
	height:48px;
	background-image: url(img/menuhover2.jpg);
	background-position:0px 50px;
}

.podmenu{
	margin-left:250px;
	padding:10px 0px 0px 0px;
}

.podmenu1{
	margin-bottom:10px;
}

.reklama{
	margin-left:250px;
	padding:10px 0px 0px 0px;
}

.img1{
	margin-left:750px;
	margin-top:-1110px;
}

.img2{
	background-image:url(img/modul.jpg);
	width:670px;
	height:140px;
	margin-left:500px;
	margin-top: 10px;
	font-size:12px;
}

.img3{
	margin-left:500px;
	margin-top:5px;
}

.img4{
	float:left;
	margin-left:840px;
	margin-top:-355px;
}

.img5{
	margin-left:500px;
	margin-top:5px;
}

.ssilka{
	font-size:18px;
	margin-left:200px;
	padding-top:30px;
}

.nizfon{
	padding-top:25px;
	height:210px;
	width: 1920px;
	background-image:url(img/nizfon.jpg);
	border-top: 2px solid #9BC550;
    background: #3C3E37;
    color: #ACADAB !important;
}

.block-type-siteinfo {
	margin-left:5px;
	display:inline-block;
    font-size: 0.8em;
	color: #9BC550 !important;
}

.footer {
	margin-left:250px;
	margin-top:10px;
	display:inline-block;
    background: #3C3E37;
    color: #ACADAB !important;
}

.block-text {
	margin-left: 250px;
    margin-top: -25px;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 90%;
    vertical-align: baseline;
    background: transparent;
	color: #ACADAB !important;
}

.footer2{
	padding-top:0px;
	margin-left: 275px;
	margin-top:0px;
	color: #ACADAB !important;
}

.footer3{
	position: absolute;
	height:auto;
	width:auto;
	padding-top:0px;
	;
	margin-top:10px;
	color: #ACADAB !important;
}

.imgsoc{
	margin-left: 0px;
	margin-top: 10px;
	}

.imgsoc2{
	margin-left: 65px;
	margin-top: -65px;
	}
	
.imgsoc3{
	margin-left: 130px;
	margin-top: -65px;
	}
	
.imgsoc4{
	margin-left: 195px;
	margin-top: -65px;
	}
	
.imgsoc5{
	margin-left: 260px;
	margin-top: -65px;
	}

.accenter{
	font-size: 1.25em;
    font-weight: normal;
    color: #FFF !important;
	}
	


.block-text2{
	margin-top:-140px;
}

.gallery-collection-type-pix .gallery-collection-item-img {
    width: 154px;
    display: block;
}

.block-type-counters {
    padding: 10px 0 0;
}
.block-type-counters {
}
.block {
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.cleared::after, .block-content::after, .block-type-catalogitem::after {
    content: '';
    display: block;
    clear: both;
}
элемент {
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.block-text {
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.block-type-counters-counter {
    display: inline-block;
    max-width: 88px;
    max-height: 150px;
    overflow: hidden;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

#footer A {
    color: #9BC550 !important;
}
a, .pseudo-link {
    color: #990000 !important;
}
A {
    color: #00659B;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.block-type-counters-counter IMG, .block-text .block-type-counters-counter IMG {
    float: none;
    border: none;
    margin: 0;
}
.block-text IMG {
    margin-right: 10px;
}
.block-text IMG {
    max-width: 100%;
}
.block-text IMG {
    border: 1px solid #DCDCDC;
    margin: 0 16px 10px 0;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.block-type-counters-counter {
    display: inline-block;
    max-width: 88px;
    max-height: 150px;
    overflow: hidden;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

#footer A {
    color: #9BC550 !important;
}
a, .pseudo-link {
    color: #990000 !important;
}
A {
    color: #00659B;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.setup-bottom-panel {
    position: fixed;
    z-index: 999;
    width: 1210px;
    bottom: 0;
    height: 25px;
    font-family: PT Sans, Arial, Tahoma, sans-serif;
    background-image: linear-gradient(-180deg, rgba(77,77,77,0.69) 4%, 			      	    rgba(45,45,45,0.69) 99%);
    box-shadow: 0px -2px 20px 0px rgba(0,0,0,0.40);
	margin-left:0px;
}

.setup-bottom-panel--txt, .setup-bottom-panel--txt:hover {
    color: #fff !important;
}
.setup-bottom-panel--txt {
    display: inline-block;
    font-size: 12px;
    color: #ffffff;
    text-align: right;
    line-height: 25px;
    position: absolute;
    bottom: 0px;
    left: 250px;
    text-decoration: none;
}

.setup-bottom-panel--button, .setup-bottom-panel--button:hover {
    color: #000 !important;
}
.setup-bottom-panel--button {
    display: inline-block;
    background-image: linear-gradient(0deg, #faa946 0%, #fac346 97%);
    box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.30), inset 1px 2px 1px 0px   	   rgba(255,255,255,0.30);
    width: 195px;
    height: 25px;
    font-size: 14px;
    color: #000;
    line-height: 25px;
    text-shadow: 0px 1px 0px rgba(255,255,255,0.35);
    text-align: center;
    text-decoration: none;
	margin-left:700px;
}

.setup-bottom-panel--logo {
    content: ' ';
    display: inline-block;
    height: 40px;
    width: 55px;
    background-image: url(img/imgcontent/imgstr6/bukvau.png);
    background-repeat: no-repeat;
    background-size: 56px;
    position: absolute;
    bottom: 0px;
    right: 0px;
}

.textnov{
	text-shadow: 0 -1px rgba(0,0,0,0.4);
    color: #FFF !important;
	font-size: 1.15em;
    font-weight: bold;
	position: absolute;
	margin-top: 10px;
	margin-left: 20px;
}

.textnov2{
	text-shadow: 0 -1px rgba(0,0,0,0.4);
	color: #FFF !important;
	font-size: 1.15em;
	font-weight: bold;
	position: absolute;
	margin-top: 10px;
	margin-left: 20px;
}

.cleared::after, .block-content::after, .block-type-catalogitem::after {
    content: '';
    display: block;
    clear: both;
}

.block-feed-view-variant-imglarge .feed-items {
    padding-left: 0;
    margin-right: -20px;
    text-align: center;
	}
.block-type-feedimg .feed-items {
    padding: 1em 0 0;
    padding-left: 0px;
    line-height: 1.3;
}
OL, UL {
    list-style: none;
	width:300px;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
        margin-right: 0px;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.block-type-feedimg .feed-items LI, .block-feed-view-variant-imglarge .feed-items LI.feed-item-1, .block-feed-view-variant-imgsmall .feed-items LI.feed-item-1 {
    margin-right: 20px;
}
.block-feed-view-variant-imglarge .feed-items LI.feed-item-1 {
    margin: 0 10px -1px 0;
}
.block-feed-view-variant-imglarge .feed-items LI {
    width: 300px;
    max-height: 300px;
    margin-right: 0;
}
.block-type-feedimg .feed-items LI {
    float: left;
    margin: 0 6px 20px 0;
    margin-right: 6px;
    width: 140px;
    min-height: 80px;
    overflow: hidden;
    vertical-align: top;
    display: inline-block;
    text-align: left;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.block-type-feedimg .feed-items A {
    text-decoration: none;
}
a, .pseudo-link {
    color: #990000 !important;
}
A {
    color: #00659B;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.block-feed-view-variant-imglarge .feed-items A SPAN {
    height: 1.2em;
}
.block-type-feedimg .feed-items A SPAN {
    display: block;
    overflow: hidden;
    margin: 0 0 4px;
    text-decoration: underline;
}
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, A, ABBR, ACRONYM, BIG, FONT, IMG, SMALL, CENTER, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, TBODY, TFOOT, THEAD, TR {
    margin:0;
    padding:0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: transparent;
	line-height:1.5;
}

.iul{
	margin-left:200px;
	padding-top:30px;
	}

#podser{
	line-height:1.1;
}	

.schetchik{
	margin-left:952px;
	margin-top:-10px;
}

.zvezda{
	position:absolute;
	margin-left:250px;
	margin-top:-365px;
}

.feedback {
    
}

.feedback {
   
}

.modalbox {
	border-radius: 10px !important; /* Уголки */
	background-color: #000066 !important;
    color: #ffffff !important;
	top: 300px;
    position: fixed;
	font: bold 16px/40px Arial, Helvetica, sans-serif;
    left: -75.5px;
    display: block;
    cursor: pointer;
    padding: 10px 11px;
    font-size: 1.2em;
    border: solid 1px #F9F9F9;
    width: 150px !important;
    text-decoration: none;
    text-align: center;
    margin:0 auto 20px;
	 -moz-border-radius: 0 0 10px 10px;
    -webkit-border-radius: 0 0 100px 10px;
    border-radius: 0 0 10px 10px;
    -moz-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
}

/* Форма обратной связи */
#inline {
    display:none;
    margin-left: 30px;
    width: 700px;
	height:410px;
    margin: 0 auto;
    background: #fff;
    padding: 10px 20px;
}
.txt { 
    display: inline-block;
    color: #676767;
    width: 190px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 5px 9px;
    font-size: 15px!important;
    line-height: 1.4em;
}
.txtarea { 
    display: inline-block;
    color: #676767;
    width: 617px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 5px 9px;
    font-size: 15px!important;
    line-height: 1.4em;
    height: 80px;
}
.txt:focus, .txtarea:focus {
 border-style: solid; 
 border-color: #bababa; 
 color: #444; 
 }
input.error, textarea.error { 
    border-color: #973d3d; 
    border-style: solid; 
    background: #f0bebe; 
    color: #a35959; 
    }
input:focus, textarea:focus{ 
    border-color: blue; 
    border-style: solid; 
    background: white; 
    color: #a35959; 
    }

#send { 
    color: #FFFFFF;
    display: block;
    cursor: pointer;
    padding: 5px 11px;
    font-size: 1.2em;
    border: solid 1px #F9F9F9;
    border-radius: 2px;
    background: #70C6B9;
    width: 210px;
    margin-bottom: 20px;
}

#send2 { 
    color: #FFFFFF;
    display: block;
    cursor: pointer;
    padding: 5px 11px;
    font-size: 1.2em;
    border: solid 1px #F9F9F9;
    border-radius: 2px;
    background: #70C6B9;
    width: 210px;
    margin-bottom: 20px;
	margin-left:230px;
	margin-top:-53px;
}

#send:hover {
    background: #979797;
}

#send2:hover {
    background: #979797;
}

.galer{
	width: 830px;
	height: 210px;
	margin-left:500px;
	margin-top:-1110px;
	}
Извините, не пояснил суть вопроса!
Создаю сайт. Устанавливаю ширину всех блоков (header, footer, body и т. д.) равной 1920px. Но, проблема в том, что сайт, почему-то получается шире, примерно, на 500px. То есть, например, задаю свойство body width: 1920px, но он получается шире на 500px. Также, и другие блоки... Через "Инспектор кода" в Mozilla, найти проблему не получается. Помогите, пожалуйста!
 

BaNru

Пацифизжу
Команда форума
Регистрация
13.11.2010
Сообщения
4 137
1) Ширину надо устанавливать не на HTML, а на BODY
2) В ширину также включаются padding'и и margin'ы
3) Если на странице есть что-то шире, например картинка, то ширина страницы будет растягиваться под неё.
 

Pavl

Active Member
Регистрация
28.09.2016
Сообщения
43
BaNru сказал(а):
1) Ширину надо устанавливать не на HTML, а на BODY
У HTML убрал свойство width, оставил только у BODY. Абсолютно, ничего не изменилось. Вот, почему я задаю, например, у BODY width: 1920px, замеряю линейкой, получается на 500px шире? И так с любым блоком, и с картинкой, тоже.
 

Volly

Well-Known Member
Регистрация
21.03.2012
Сообщения
831
Pavl, такой длинный код лучше тут не писать. Хлопотно прокручивать страницу в браузере.
Прикрепите необходимые файлы к следующему вашему сообщению.
А для начала посмотрите внимательно верстку и стили и уберите дубли строк.
Потом обратите внимание на то, что в третьей и четвертой строках вёрстки блок
<head> почему-то вложен в <body>, а такого быть не должно.


Попробовал всё-таки ваш код как есть и померил линейкой. У меня получилась ширина 1920px, как и задано в стилях.
 

Pavl

Active Member
Регистрация
28.09.2016
Сообщения
43
Volly сказал(а):
Попробовал всё-таки ваш код как есть и померил линейкой. У меня получилась ширина 1920px, как и задано в стилях.
Есть ли этому феномену, какое-либо объяснение? Код, который я выложил в точности такой же, как у меня, ни больше, ни меньше. Браузер Mozilla, в нём обычный масштаб - 100%. <head> из <body> убрал - всё по-прежнему.
Только, хотел уточнить, когда Вы пишите:
Прикрепите необходимые файлы к следующему вашему сообщению.
Какие файлы нужно прикрепить?
И
уберите дубли строк
Это Вы имеете в виду в файле CSS, убрать дубли строк?
 

BaNru

Пацифизжу
Команда форума
Регистрация
13.11.2010
Сообщения
4 137
Когда вы не можете выбрать только интересующие вас куски, то лучше оставлять ссылку на онлайн версию (ссылку на сайт, или например на бесплатный хостинг или http://jsfiddle.net/).

Чем меньше действий нам, тем больше шансов, что вам помогут :)
 

Pavl

Active Member
Регистрация
28.09.2016
Сообщения
43
Всё оказалось, как всё гениальное - просто. Надо было, всего лишь, правильно настроить по умолчанию параметры экрана в Windows - на 100%. А у меня было настроено на 125%, от этого всё время экран и становился больше на 25% от тех свойств, которые задавал. :)
Чтобы закончить тему с масштабированием, хотелось бы, спросить - как сделать, чтобы горизонтальный бегунок внизу экрана появлялся, только при увеличении масштаба в браузере, начиная с 200%, не менее?
 

BaNru

Пацифизжу
Команда форума
Регистрация
13.11.2010
Сообщения
4 137
Такое скриптами можно. Но я бы не советовал, тем более если не знаешь как :)
Либо можно попытаться через @media, через какой-нибудь initial-scale, надо искать и пробовать правильный запрос. И, конечно, также не советовал бы.
 
Статус
Закрыто для дальнейших ответов.
Верх Низ