Search the Community

Доброго времени суток. Есть css меню, из ряда разделов, последний - форма поиска. При маштабировании (уменьшении масштаба) блок с формой поиска уезжает. Старница с проблемой: http://www.kino.sumy.ua/ , ширина страницы 1024px. Скриншот №1, без масштабирования Скринфот №2, тоже меню при масшатабировании.

Всем привет, думаю частый вопрос, но решение я так и не нашёл. Вот шаблон <div class="wrapper"> <header class="header"> <div id="logo"> <a href="/" style="color: #CCC;"> <img id="logoimg" src="<?=$site['shablon']?>img/logo.gif" /> <!—<h2><?=!$site['title'];?> <?=!$site['losung'];?></h2> <!— название сайты—> <!— Лозунг—> </a> </div> </header><!-- .header--><div class="line"></div> <div class="middle"> <div class="container"> <div class="upbar"> <?php up(); ?></div><?php require "{$config->APP_PATH}/views/vmaterial.php"; ?> </div><!-- .container--> <aside class="leftbar"> <?php left() ;?> </aside><!-- .left-sidebar --> </div><!-- .middle--> <footer class="footer"> <div id="leftfooter"> <?php echo $site['contitul']; ?> </div> <div id="rightfooter"> <?php mobi();?> </div> </footer><!-- .footer --></div><!-- .wrapper -->А вот CSS: html{width: 100%;height: 100%;}body {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;width: 100%;height: 100%;}/*Шаблон*/.wrapper{ width: 80%;margin: 5px 0 5px 10%;height: 100%;}.header{ width:100%;height:135px;background:#999999;}.line{ background:url(img/line.jpg);height:5px;position: relative;background-size:contain;}#logo { width: 100%;height: 100%;}.middle{ background:#999;height:100%;}.container{float: right;width: 80%;}.leftbar {float: right;width: 20%;background: #B5E3FF;} .leftbar выходит за пределы по высоте. Если поставлю height: 100% то содержимое этого блока спокойно выходит, но блок заканчивается в нужном месте. Нужно что бы растягивало и подгоняло .container

Есть список услуг, каждая категория - это ссылка, список находится слева. Нужно так, чтобы при нажатии на категорию сбоку появлялся блок. При этом, нужно, чтобы при нажатии на другую категорию этот блок закрывался и появлялся новый. если можно чтобы плавно появлялся блок. Помогите пожалуйста, народ, очень нужно.

Всем привет. Ребят помогите с версткой, прилагаю образец, результат, код. Как надо - У меня получилось так - проблемы - 1) 1 и 2, 3 и 4, 5 и 6 блоки (блоки категорий) должны находится на одной высоте по отношению к друг другу 2) "подкатегории" должны прилипать друг к другу 3) лишний отступ код: <div class="category_list"> <div class="category"><div class="title">Дизайн-студия</div><div class="subcategory_list"> <div class="subcategory"><div class="bullit"><img src="img/bullit.png" alt=""></div><div class="subcategory_desc"><a>Айдентика:</a><span>разработка логотипов, фирменных стилей, бренд-буков</span></div></div> <div class="subcategory"><div class="bullit"><img src="img/bullit.png" alt=""></div><div class="subcategory_desc"><a>Дизайн наружной рекламы:</a><span>выставочные стенды, вывески, вывески, баннеры, широкоформат, световые короба, комплексное оформление</span></div></div> <div class="subcategory"><div class="bullit"><img src="img/bullit.png" alt=""></div><div class="subcategory_desc"><a>Дизайн полиграфии:</a><span>листовки, флаеры, визитки, плакаты, афиши, буклеты, каталоги</span></div></div> </div></div> <div class="category"><div class="title">Размещение рекламы</div><div class="subcategory_list"> <div class="subcategory"><div class="bullit"><img src="img/bullit.png" alt=""></div><div class="subcategory_desc">Нет привязанных подкатегорий.</div></div> </div></div> <div class="category"><div class="title">Полиграфия</div><div class="subcategory_list"> <div class="subcategory"><div class="bullit"><img src="img/bullit.png" alt=""></div><div class="subcategory_desc">Нет привязанных подкатегорий.</div></div> </div></div> <div class="category"><div class="title">Фото-видео</div><div class="subcategory_list"> <div class="subcategory"><div class="bullit"><img src="img/bullit.png" alt=""></div><div class="subcategory_desc"><a>Предметная фотосъемка:</a><span>художественная фотосъемка, съемка продукции для каталогов и сайтов</span></div></div> </div></div> </div>

Здравствуйте форумчане. А подскажите мне пожалуйста как можно сотворить список статей, как примерно показанно на картинке, прикрепленной мною. Так, что все выводились друг за другом и имели строго такой вид, как я изобразил. Есть код мною написанный, но уже третья статья уезжает вниз, чего совсем не нужно. Помогите разобраться и привести код и все остальное в божеский адекватный вид. Я немного новичок в верстке, поэтому нужна помощь. <div calss="wrapper"> <div id="articles"> <div class="article">...</div> <div class="article">...</div> <div class="article">...</div> <div class="article">...</div> </div></div>.wrapper { margin: 0 auto; width: 970px;}.article { background: #f3f3f3; width: 310px; height: 300px; padding: 0 20px 20px 0; position: relative;}

Ребят, испробовал уже кучу методов, не пойму что мешает... Вот сайт: http://testwp.sysrtfm.ru/ на розовом фоне меню, хочу его элементы разместить по центру, по горизонтали... Если не сложно посмотрите плз. Буду признателен

Например, берем самый простой код <div style="background-image:url('any.jpg'); width:500px; height:230px; border-radius: 5px 5px 5px 5px; float:left;">123</div> запускаем это в браузере и отправляем на печать. Любой браузер печатает только цифры 123. Фоновывй рисунок и стили оформления почему-то полностью игнорируются. Что сделать с дивом, чтоб его можно было отправлять на печать в виде близком к тому, что есть на экране в браузере? Да, аудитория, которой предназначен сайт про print screen ничего не знает.

Не могу найти причину, почему #r_side исчез, а #content вылез на всю страницу. jb-style.com.Но это произошло после добавления таблицы внизу

Подскажите как правильно создать таблицу с помощью тегов div. Я пытался, но она выходит не идеально. При изменении масштаба, колонки "плывут". <html> <head> <title></title> </head> <body> <div style =" width: 300px; height:210px; float:left; border: 1px solid; " > Text </div> <div style =" width: auto; height:auto; float:left; border:0px; " > <div style =" width: 300px; height:auto; float:left; margin: 0px 1px 1px; border: 0px solid; " > <div style =" width: initial; height:50px; border: 1px solid; " > </div> <div style =" width: initial; height:50px; margin-top:1px ; border: 1px solid; " > </div> <div style =" width: initial; height:50px; margin-top:1px ; border: 1px solid; " > </div> </div> <div style =" width: 300px ; height:157px; float:left; margin: 0px 1px 1px ; " > <div style =" width: initial; height:103px; border: 1px solid; " > </div> <div style =" width: initial; height:50px; margin-top:1px ; border: 1px solid; " > </div> </div> </div> <div style =" width: 600px ; height:50px; float:left; margin: 1px ; border: 1px solid; " > </div> </body></html>Заранее благодарю за ответ.

Вот мои исходники http://jsfiddle.net/z8Tm5/ Вроде бы все нормально. В браузере firefox все нормально блок стоит по центру. http://s020.radikal.ru/i706/1311/90/e2428552a945.jpg А вот в браузере Яндекс вот такая вот картина http://s020.radikal.ru/i718/1311/17/50ad88c42380.jpg как видите блок div по центру не выровнялся, почему так ?

Помогите, пожалуйста, сверстать без JS следующую конструкцию: Всё, что я перепробовал, давало различные проблемы: выталкивание зелёного блока за пределы таблицы, растягивание цветных блоков на всю высоту экрана или скучивание в центре ячейки в одном из браузеров. UPD. Вот пример, как всё должно быть (двигаем границу окошка и смотрим на растягивание красного блока) В примере использован JavaScript, а я ищу возможность обойтись без него.

Здравствуйте, уважаемые гуру! Не могли бы вы подсказать, как выровнять картинку по центру div'а в коде, который будет представлен ниже. Я знаю, что код не совершенен, и если вам будет не трудно, укажите на ошибке и если можно с объяснениями, чтобы я мог исправить их в дальнейшем. Буду очень признателен за помощь. css: body { width:100%; height:100%; } body div#rotator{ float:left; min-width: 60%; max-width: 65%; min-height: 70%; max-height: 80%; } #rotator li img { min-width: 85%; max-width: 100%; min-height: 75%; max-height: 80%; } #rotator div > ul.list{ position: relative; list-style: none; padding: 0px; min-width: inherit; max-width: inherit; min-height: inherit; max-height: inherit; } #rotator ul.list > li { position: absolute; margin: 0 auto; list-style: none; min-width: inherit; max-width: inherit; min-height: inherit; max-height: inherit; } #rotator ul.list > li.show { z-index:500; min-width: inherit; max-width: inherit; min-height: inherit; max-height: inherit; }код html: <div id="rotator"> <ul class="list"> <li class="show"><img src="<?php echo $path.'/1'.$type; ?>"/></li> <?php for ($i=2;$i<=$count;$i++){?> <li><img src="<?php echo $path.'/'.$i.$type; ?>"/></li> <?php } ?> </ul> </div>Если нужно, данный код располагается здесь. Заранее размер картинки неизвестен. Нужно чтобы и вертикальные и горизонтальные картинки были одинаково расположены по центру. Пожалуйста, помогите!

Здравствуйте! Посидев на сайте htmlbook.ru в разделе макеты, попробывал сделать получилось,но у меня есть проблема,заключается она в том,что я хочу сделать резиновый макет с тремя колонками,там он есть но он не резиновый и поэтому хотел узнать как мне такой сделать,я новичок если кто сможет объяснить или просто совет дать буду рад выслушать).И ещё кое что,там в макетах есть 1 резиновый макет с двумя колонками вот вопрос, сделав макет и сделав два блока меню слева использую float у меня получилось,сделал 3ий блок хотел сделать меню справа,но блок почему то оказался на уровне нижнего блока слева пытался поднять его на верх не получилось!Если кто может помогите мне с этими 2умя вопросами(понимаю они далеко не корректные,но я в этих делах пока не силён,надеюсь на вашу помощь) заранее огромное спасибо)!

Ребята! Вот как я не лазил по сайтам, посвященным html/css — никак мне нормально рассказать не могут (или это у меня руки кривые). Короче есть код: #menu { width: 600px; height: 30px; margin: 0px auto; } #menu ul { margin: 0px; padding: 0px; list-style: none; } #menu li { display: inline; } #menu a { display: block; float: left; width: 150px; padding: 5px 0px; text-align: center; text-decoration: none; font-weight: bold; background: #EEEEEE; } #menu a:hover { background: #CCCCCC; } происходит нормальное выравнивание по вертикали по центру! Вот как тут: http://template.ho.ua/norm/ Делаю ТОЧНО по аналогии, но только мне DIV-ы пошире нужны, да и повыше (не хочу чужой код лопатить) И У МЕНЯ, блин пасхальный, текст выравнивается по вертикали СВЕРХУ (тут вырезается цензурой)!!! http://template.ho.ua/my/ ЧТО Я (тут вырезается цензурой), блин дырявый, не так делаю!? Может кто подскажет такие вещи: как, используя в div-e height выровнять по вертикали по центру!? чему будет равна высота такого div-а и как ее вычислить: div.test { font-family:verdana; paddind-top:10px; paddind-bottom:10px; font-size:11px; }

Доброго времени суток! Взявшись за изучение языков(html и css по курсам от "Специалиста") прошёл первую ступень,начал потихоньку понимать основы , смотря на код понимаю что к чему! Но когда пытаюсь сам сделать не опираясь на примеры,ничего не выходит то ли фантазии не хватает, то ли я чего то не понимаю просто не могу (пытаюсь делать div-ами но к сожалению ничего не выходит)!Знаю тут даже вопроса нету,да и даже если бы был нормально поставлен все равно был бы глупым,поэтому может просто дадите какой нибудь совет?(учил нормально не кое как)

Здравствуйте, уважаемые посетители форума. Замучался решать вопрос, он следующий. У меня есть скрипт ротатора картинок, который меняет картинки по времени (делает это через ul). Как сделать так, чтобы картинки которые он выводит НИКОГДА не выходили за границы div'а? И еще вопрос. Мне нужно чтобы все это было адаптивно к экрану (будет показываться на full HD, но была бы возможность посмотреть с 17-24"(Radmin)). Если вас не затруднит, помогите пожалуйста. Код прилагаю. В нем о размещении элементов даже не пахнет (много раз исправлял). Нужен такой вариант как во вложении (картинке), чтобы так было на всех экранах (ток картинки по-больше в высоту ну и выровняно). Понимаю, что прошу много, если это трудно - подскажите в какую сторону копать, я плох в css и js. Спасибо огромное тем, кто откликнется P.S. Картинка может быть как вертикальная, так и горизонтальная (на схеме показано) <?php error_reporting(E_ALL); header('Content-Type: text/html; charset=utf-8'); include "scripts/config.php"; $errors=connect(); $sql=mysql_query('SELECT * FROM `index`') or die (mysql_error()); if(mysql_num_rows($sql) <= 0) echo 'ошибка'.$errors; $row=mysql_fetch_assoc($sql); $path=$row['images']; $count=count(glob('images/'.$path.'*.jpg')); if($count == 0){?> <img src="default/1.jpg" width="500" height="313"> <?php exit(); } ?> <!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> <link rel="stylesheet" href="clock/assets/css/style.css"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type="text/css"> div#rotator { float:left; width: 800px; max-width: 75%; } div#rotator img { max-width: 100%; height: auto; } div#rotator ul{ position: relative; list-style: none; padding: 0px; } div#rotator ul li { position: absolute; list-style: none; } div#rotator ul li.show { z-index:500; } .clock { float: right; } .main { float: right; } .marq{ position: absolute; bottom: 0; right: 0; left: 0; } .text { color: blue; font-size:95px; } </style> <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> <script type="text/javascript"> function theRotator() { var time="<?php echo $time;?>"; // Устанавливаем прозрачность всех картинок в 0 $('div#rotator ul li').css({opacity: 0.0}); // Берем первую картинку и показываем ее (по пути включаем полную видимость) $('div#rotator ul li:first').css({opacity: 1.0}); // Вызываем функцию rotate для запуска слайдшоу, 5000 = смена картинок происходит раз в 5 секунд setInterval('rotate()',time); } function rotate() { // Берем первую картинку var current = ($('div#rotator ul li.show')? $('div#rotator ul li.show') : $('div#rotator ul li:first')); // Берем следующую картинку, когда дойдем до последней начинаем с начала var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $('div#rotator ul li:first') :current.next()) : $('div#rotator ul li:first')); // Расскомментируйте, чтобы показвать картинки в случайном порядке // var sibs = current.siblings(); // var rndNum = Math.floor(Math.random() * sibs.length ); // var next = $( sibs[ rndNum ] ); // Подключаем эффект растворения/затухания для показа картинок, css-класс show имеет больший z-index next.css({opacity: 0.0}) .addClass('show') .animate({opacity: 1.0}, 1000); // Прячем текущую картинку current.animate({opacity: 0.0}, 1000) .removeClass('show'); }; $(document).ready(function() { // Запускаем слайдшоу theRotator(); }); </script> <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> <script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.0.0/moment.min.js"></script> <script src="clock/assets/js/script.js"></script> </head> <body> <div id="rotator" align="center"> <ul> <li class="show"><img src="<?php echo 'images/'.$row['images'].'1'.$type; ?>" class="img_main" /></li> <?php for ($i=2;$i<=$count;$i++){?> <li><img src="<?php echo 'images/'.$row['images'].$i.$type; ?>" class="img_main" /></li> <?php } ?> </ul> </div> <div class="main"> <img src="<?php echo 'config_images/'.$row['logo']; ?>" class="main"> </div> <div class="clock"> <?php include "clock/index.html"; ?> </div> <div class="marq"> <marquee direction="left" loop="-1" behavior="scroll" scrolldelay="1" scrollamount="10"> <span class="text"><?php echo $row['marquee'];?></span> </marquee> </div> </body> </html>

Имеем. <div class="slide"><div class="content"></div></div> <div class="box"><div class="content"></div></div> как правильно описать это в CSS чтоб каждый класс контент был привязан к своему классу. (т.е. чтобы у меня было 2 разных стиля "content")

Ребят при добавлении стилю DIVу элемента padding у этого DIVа увеличивается размер. Если на пальцах есть блок размеров 200 на 400. В его стиле прописываю padding:10px; и блок становится размером 220 на 420. Как этого избежать? Ведь padding должен просто делать отступы внутри блока а не менять его размер.

Есть вот такой не сложный код: <html> <head> </head> <body style="margin:0;padding:0;"> <div style="margin:0 auto; width:600px; height:300px; background:red;" id="1"> <div id="2" style="margin:30px 0 0 0; width:200px; height:100px; background:grey;"> </div> </div> </body> </html> Почему div с id=2 делает отступ не относительно div c id=1 и более того получается так что тот же div c id=1 тоже получает отступ от верхней границы 30px ? В общем что я неправильно делаю или как это полечить ?

Привет форум, помогите разобраться как разместить div'вы в один ряд как это показано на схеме делаю следующие: .big { width: 301px; display: inline-block; float: left; padding: 5px; } .mini { width: 145px; display: inline-block; float: left; padding: 5px; } а вот как без position:absolute в этой же строке разместить второй маленький блок под первым ума не приложу ...

Ребята, помогите решить проблему. Недавно начал интересоваться версткой и вопросы возникают чуть-ли не каждый день. Столкнулся с проблемой, которую не могу решить посредством поиска в Google. Суть проблемы: 1) Создаю div без фиксированной высоты. 2) Помещаю в него другие div с некоторым содержимым и задаю им свойство float: left 3) Родительский div при этом, что логично, игнорирует свои "внутренности" из-за вышеописанного свойства и его высота становится равна 0 4) Объекты, находящиеся ниже в разметке документа при этом начинают накладываться поверх div'a из п.1,3 Вопрос: можно ли каким-либо образом заставить родительский div регулировать свою высоту по содержимому, которому приписано свойство float? Спасибо!

Добрый день. Помогите решить следующую проблему: имеется резиновый шаблон (3 колонки), когда в среднюю колонку помещаю блок который шире её, шаблон не тянется, а этот блок просто выходит за пределы родительского. Как сделать чтобы родительский блок растягивался? Вариант задать min-width не подходит, т.к. на разных страницах может быть разный контент, и он будет или вмещаться в текущую ширину родителя, или тянуть его. <!DOCTYPE html> <html> <head> <title>Layout 1</title> <meta content="text/html; charset=iso-8859-1" http-equiv="content-type"> <meta content="HAPedit 3.1" name="generator"> <style type="text/css"> html,body{margin:0;padding:0} body{font: 76% arial,sans-serif} p{margin:0 10px 10px} a{display:block;color: #006;padding:10px} div#header{position:relative} div#header h1{height:80px;line-height:80px;margin:0; padding-left:10px;background: #EEE;color: #79B30B} div#header a{position:absolute;right:0;top:23px} div#content p{line-height:1.4} div#navigation{background:#B9CAFF} div#extra{background:#FF8539} div#footer{background: #333;color: #FFF} div#footer p{margin:0;padding:5px 10px} div#footer a{display:inline;padding:0;color: #C6D5FD} div#wrapper{float:left;width:100%} div#content{margin: 0 25%} div#navigation{float:left;width:25%;margin-left:-100%} div#extra{float:left;width:25%;margin-left:-25%} div#footer{clear:left;width:100%} </style> </head> <body> <div id="container"> <div id="header"> <h1>Header</h1> <a href="http://blog.html.it/layoutgala/layout01.zip">download this layout</a> </div> <div id="wrapper"> <div id="content"> <p> <strong>1) Content here.</strong> column long long column very long fill fill fill long text text column text silly very make long very fill silly make make long make text fill very long text column silly silly very column long very column filler fill long make filler long silly very long silly silly silly long filler make column filler make silly long long fill very. </p> <p> very make make fill silly long long filler column long make silly silly column filler fill fill very filler text fill filler column make fill make text very make make very fill fill long make very filler column very long very filler silly very make filler silly make make column column </p> <p> fill long make long text very make long fill column make text very silly column filler silly text fill text filler filler filler make make make make text filler fill column filler make silly make text text fill make very filler column very </p> <p> column text long column make silly long text filler silly very very very long filler fill very fill silly very make make filler text filler text make silly text text long fill fill make text fill long text very silly long long filler filler fill silly long make column make silly long column long make very </p> <div style="width: 2000px; border: 1px solid black; background-color: yellow;">asd</div> </div> </div> <div id="navigation"> <p> <strong>2) Navigation here.</strong> long long fill filler very fill column column silly filler very filler fill fill filler text fill very silly fill text filler silly silly filler fill very make fill column text column very very column fill fill very silly column silly silly fill fill long filler </p> </div> <div id="extra"> <p> <strong>3) More stuff here.</strong> very text make long silly make text very very text make long filler very make column make silly column fill silly column long make silly filler column filler silly long long column fill silly column very </p> </div> <div id="footer"> <p>The footer. You can go to the <a href="http://blog.html.it/layoutgala/">index page</a>.</p> </div> </div> </body> </html> Посмотреть код: http://pastebin.com/K2nCfrR5 Скачать шаблон: http://clck.ru/8ncR2

Здравствуйте. Подскажите пожалуйста. Как сделать что бы текст не переходил на другую строчку на границе div?

Здравствуйте! У меня проблема: <div class="shashka"><h2>Заказ такси</h2></div> .shashka { background: url(../images/shashka.png) no-repeat; height: 66px; margin: 0 auto; width: 191px; } .shashka h2 { color: #fff; font-size: 24px; margin-top: 15px; <—— Это свойство сдвигает не заголовок относительно .shashka, а весь блок .shashka на 15px вниз text-align: center; } Почему это происходит??? Может кто нибудь сталкивался с этим? Если добавляешь к .shashka { border: 1px solid white; } то все работает нормально, h2 смещается вниз на 15px, а не весь блок <div class="shashka">

Всем привет!) У меня такая проблема: съезжает центр сайта влево. (причём в одном и том же браузере при одном и том же масштабе на разных компах по-разному, т.е. на одном всё отлично, на другом съезжает.) Сейчас покажу в чём проблема: Вот код самой страницы: <?php // вся процедура работает на сессиях. Именно в ней хранятся данные пользователя, пока он находится на сайте. Очень важно запустить их в самом начале странички!!! session_start(); include ("bd.php");// файл bd.php должен быть в той же папке, что и все остальные, если это не так, то просто измените путь if (isset($_GET['id'])) {$id =$_GET['id']; } //id "хозяина" странички else { exit("Вы зашил на страницу без параметра!");} //если не указали id, то выдаем ошибку if (!preg_match("|^[\d]+$|", $id)) { exit("<p>Неверный формат запроса! Проверьте URL</p>");//если id не число, то выдаем ошибку } if (!empty($_SESSION['login']) and !empty($_SESSION['password'])) { //если существует логин и пароль в сессиях, то проверяем, действительны ли они $login = $_SESSION['login']; $password = $_SESSION['password']; $result2 = mysql_query("SELECT id FROM users WHERE login='$login' AND password='$password' AND activation='1'",$db); $myrow2 = mysql_fetch_array($result2); if (empty($myrow2['id'])) { //Если не действительны (может мы удалили этого пользователя из базы за плохое поведение) exit("Вход на эту страницу разрешен только зарегистрированным пользователям!"); } } else { //Проверяем, зарегистрирован ли вошедший exit("Вход на эту страницу разрешен только зарегистрированным пользователям!"); } $result = mysql_query("SELECT * FROM users WHERE id='$id'",$db); $myrow = mysql_fetch_array($result);//Извлекаем все данные пользователя с данным id if (empty($myrow['login'])) { exit("Пользователя не существует! Возможно он был удален.");} //если такого не существует ?> <HTML> <HEAD> <meta charset="UTF-8"> <title>Galaxy-wow | <?php echo $myrow['login']; ?></title> <?php include ('head.php'); ?> </HEAD> <BODY> <!--=== HEADER ===--> <div class="center"> <img src="images/borders/border_top.png" valign="top"> <?php include ('menu_with_exit.php'); ?> <img src="images/borders/border_bottom.png" valign="top"> </div> <center> <table> <tr> <td class="center_stretch"> <div class="padding"> <h2>Страница пользователя <a href="page.php?id=<?php echo $myrow['id']; ?>"><?php echo $myrow['login']; ?></a></h2> <hr color="gray" style="width: 500px; margin-left: 0px;"> <?php if ($myrow['login'] == $login) { //Если страничка принадлежит вошедшему, то предлагаем изменить данные и выводим личные сообщения print <<<HERE <div class="my_page_container"> <div class="avatar_border"> <img alt='аватар' style="margin-top: 7px; margin-left: 7px;" src='$myrow[avatar]'> </div> <div class="login_border"> <p style="text-align: center; font-size: 20pt; margin-top: 15px;"> HERE; echo $myrow['login']; print <<<HERE </p> </div> <br> <br> </div> <div class="my_menu_container" style="margin-top: -18px;"> HERE; include ('my_menu.php'); print <<<HERE </div> HERE; } else { //если страничка чужая, то выводим только некторые данные и форму для отправки личных сообщений print <<<HERE <div class="my_page_container"> <div class="avatar_border"> <img alt='аватар' style="margin-top: 7px; margin-left: 7px;" src='$myrow[avatar]'> </div> <div class="login_border"> <p style="text-align: center; font-size: 20pt; margin-top: 15px;"> HERE; echo $myrow['login']; print <<<HERE </p> <!-- spoiler --> <a href="" class="spoiler_links"><p style="text-align: center; margin-top: 5px;">Отправить письмо</p></a> <div class="spoiler_body"> <div style="text-align: left; margin-top: 50px; margin-left: -100px;"> <h2 style="padding-bottom: 5px;">Текст письма:</h2> <form action='post.php?id=$_SESSION[id]' method='post'> <textarea name='text' class="message"></textarea><br> <input type='hidden' name='poluchatel' value='$myrow[login]'> <input type='hidden' name='id' value='$myrow[id]'> <input class="message_button" type='submit' name='submit' value=''> </form> </div> </div> <!-- spoiler --> </div> <br> <br> </div> <div class="my_menu_container" style="margin-top: -18px;"> <input type="button" value="" class="my_page_button" onclick='location.href="page.php?id=$_SESSION[id]"'> <input type="button" value="" class="my_accounts_button" onclick='location.href="accounts.php?id=$_SESSION[id]"'> <input type="button" value="" class="post_button" onclick='location.href="mailbox.php?id=$_SESSION[id]"'> <input type="button" value="" class="community_button" onclick='location.href="all_users.php?id=$_SESSION[id]"'> <input type="button" value="" class="settings_button" onclick='location.href="settings.php?id=$_SESSION[id]"'> </div> HERE; } ?> </div> </td> </tr> </table> </center> <!--=== CONTENT ===--> <?php include ("footer.php"); ?> </BODY> </HTML> И код стилей: /*—————————-| | General Style | |—————————-*/ body{ background: #1a0a0b url(../images/background.png) no-repeat top center; font-weight: 400; font-size: 20px; color: white; overflow-y: scroll; } a { color: #4893e4; /* Цвет обычной ссылки */ text-decoration: none; /* Убираем подчеркивание у ссылок */ } a:visited { color: #4893e4; /* Цвет посещённой ссылки */ } a:hover { color: #fff; /* Цвет ссылки при наведении на нее курсора мыши */ text-decoration: none; /* Добавляем подчеркивание */ } .reg_form { width: 168px; /* Ширина поля с учетом padding */ height: 25px; /* Высота */ background: #dad7c5 url(../images/forms/reg_form.png) no-repeat; /* Фон */ padding: 0 10px; /* Поля */ border: none; /* Убираем рамку */ font-size: 18px; /* Размер текста */ color: white; /* Белые буквы */ line-height: 25px; /* Выравниваем по центру в IE */ } .captcha_form { width: 98px; /* Ширина поля с учетом padding */ height: 25px; /* Высота */ background: #dad7c5 url(../images/forms/captcha_form.png) no-repeat; /* Фон */ padding: 0 10px; /* Поля */ border: none; /* Убираем рамку */ font-size: 18px; /* Размер текста */ color: white; /* Белые буквы */ line-height: 25px; /* Выравниваем по центру в IE */ } .form_font { font: 12pt sans-serif; color: #c3b615; } .center { width: 1100px; margin: 0 auto; margin-top: 600px; height: 54px; background: #000 url(../images/content_background.png) repeat-y top center; /* Фон */ } .center_index { width: 1100px; margin: 0 auto; height: 70px; background: #000 url(../images/content_background.png) repeat-y top center; /* Фон */ } .center_stretch { padding-top: 19px; width: 1100px; height: 100%; background: #000 url(../images/content_background.png) repeat-y top center; /* Фон */ } .center_1 { width: 1100px; height: 300px; margin: 0 auto; margin-top: 600px; background: #000 url(../images/content_background.png) repeat-y top center; /* Фон */ } .center_2 { width: 1100px; height: 1500px; margin: 0 auto; background: #000 url(../images/content_background.png) repeat-y top center; /* Фон */ } .enter_padding { margin-left: 900px; } .padding { margin-left: 15px; } .footer { width: 1100px; height: 140px; margin: 0 auto; background: #000 url(../images/content_background.png) repeat-y top center; /* Фон */ } .footer_txt { width: 1100px; height: 100px; margin: 0 auto; text-align: center; } .slider_container { float: left; width: 876px; background: url(../images/borders/border_line_header.png) no-repeat right; /* Фон */ } .enter_container { margin-top: 30px; margin-left: 20px; float: left; width: 204px; } .clear { clear: both; border: none; } .content_container { float: left; margin-left: 20px; width: 650px; } .sidebar_container { float: left; width: 380px; text-align: center; padding-left: 50px; } .title { font: 20pt sans-serif; color: #c3b615; } .captcha_background { width: 160px; height: 60px; background: url(../images/captcha_background.png) no-repeat; /* Фон */ } .reg_container { float: left; width: 380px; text-align: left; padding-left: 50px; } .my_page_container { float: left; width: 835px; } .my_menu_container { float: left; width: 219px; height: 256px; padding-top: 25px; padding-left: 27px; background: url(../images/my_menu_background.png) no-repeat; /* Фон */ } .avatar_border { margin-top: 5px; width: 104px; height: 104px; background: url(../images/borders/avatar_border.png) no-repeat; /* Фон */ float: left; } .avatar_border_in_mailbox { margin-top: 5px; width: 104px; height: 104px; background: url(../images/borders/avatar_border.png) no-repeat; /* Фон */ } .avatar_border_in_settings { margin-top: 5px; width: 104px; height: 104px; background: url(../images/borders/avatar_border.png) no-repeat; /* Фон */ } .login_border { margin-top: -3px; width: 320px; height: 91px; background: url(../images/borders/login_border.png) no-repeat; /* Фон */ float: left; } .user_info { margin-top: -50px; margin-left: 440px; position: absolute; height: 100px; width: 400px; } .scroll-pane { height: 570px; overflow: auto; float: left; width: 200px; } .message { margin-top: -3px; width: 400px; height: 200px; background: url(../images/borders/message_border.png) no-repeat; /* Фон */ padding-top: 7px; padding-left: 9px; color: white; border: none; resize: none; font-size: 13pt; } .forum_message { margin-top: -3px; width: 400px; height: 50px; background: url(../images/borders/forum_message_border.png) no-repeat; /* Фон */ padding-top: 7px; padding-left: 9px; color: white; border: none; resize: none; font-size: 13pt; } .topic_title { width: 500px; /* Ширина поля с учетом padding */ height: 32px; /* Высота */ background: #dad7c5 url(../images/borders/topic_title_border.png) no-repeat; /* Фон */ padding: 0 10px; /* Поля */ border: none; /* Убираем рамку */ font-size: 18px; /* Размер текста */ color: white; /* Белые буквы */ line-height: 25px; /* Выравниваем по центру в IE */ } .mailbox_textarea { overflow-x: auto; overflow-y: auto; width: 375px; height: 145px; margin-top: 7px; margin-left: 9px; color: white; border: none; resize: none; font-size: 13pt; } .suggestion_message { margin-top: -3px; width: 300px; height: 200px; background: url(../images/borders/suggestion_message_border.png) no-repeat; /* Фон */ padding-top: 7px; padding-left: 9px; color: white; border: none; resize: none; font-size: 13pt; } .topic_border { margin-top: -3px; width: 700px; height: 300px; background: url(../images/borders/topic_border.png) no-repeat; /* Фон */ padding-top: 7px; padding-left: 9px; color: white; border: none; resize: none; font-size: 13pt; } Помогите пожалуйста поправить дело. Если будут нужны какие-нибудь дополнительные файлы - скажите, я скину. Спасибо.