Z3RO
-
Posts
19 -
Joined
-
Last visited
Z3RO's Achievements
Explorer (1/14)
0
Reputation
-
Спасибо большое за помощь. =)
-
Да, вы правы, но всё-же возможно ли зделать так, чтобы перенос был автоматическим?
-
Из-за чего может быть такое: Скриншот и как с этим боротся?
-
Проблема решилась установлением overflow: hidden; для класа .foot. Всем спасибо за помощь. Тему #.
-
Вот http://jsfiddle.net/2ESGv/
-
16ричное представление цвета проблему не решает.
-
Я уже успел сам зделать, но всё равно огромное спасибо. Правда тут появилась еще одна проблема: пропал фон у подвала. Вот клас подвала: .foot{ background-color: rgba(198,214,229,0.8); border: 0; -moz-border-radius: 10px 10px 0 0; -webkit-border-radius: 10px 10px 0 0; border-radius: 10px 10px 0 0; margin: 0 -20%; } Скриншот Знаю, уже задолбал, но прошу вас помочь. =)
-
Можете помочь мне? Переписать код, чтобы всё выводилось правильно, потомучто я уже всё перепробывал. Вот более читабельный код: <div class="layout"> <div class="navigation"> Меню справа </div> <div class="main"> Контент </div> <div class="sidebar"> Меню слева </div> <div class="foot"> Подвал </div> </div> Вот CSS код для этих класов .foot{ background-color: rgba(198,214,229,0.8); -moz-border-radius: 10px 10px 0 0; -webkit-border-radius: 10px 10px 0 0; border-radius: 10px 10px 0 0; bottom: 0; left: 5%; margin-top: 40px; position: relative; width: 90%; } .layout{ margin: auto; position: relative; width: 95%; } .layout div{position: absolute;} .main{ border: 4px solid #5a7fa6; border-top: 0px; left: 20%; right: 20%; } .navigation{right: 0; width: 20%;} .sidebar{left: 0; width: 20%;} Пробывал зделать так, как вы говорите, но получилось вот что: Скриншот
-
Вот смотрите: подвал идёт сразу же после класса .layout вот как мне изменить стиль, чтобы подвал бчл не фиксированным и отображался сразу после лайаута? Перепробывал множество вариантов, но нужного результата так и не добился.
-
А можно будет разместить решение не на jsfiddle.net, а на другом сайте?
-
Нет, так не подойдет, поскольку так подвал налазит на контент и там и остается при прокрутке. Вот код страницы <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru"> <head><meta http-equiv="content-type" content="text/html; charset=utf-8"/> <link rel="shortcut icon" href="http://zcms/favicon.ico" /> <meta name="keywords" content="Key" /> <meta name="description" content="Description" /> <link rel="alternate" type="application/rss+xml" title="RSS | Новости ресурса" href="http://zcms/rss.php" /> <title>ZCMS | ZCMS</title> <link rel="stylesheet" href="http://zcms/theme/default/style.css" type="text/css" /> <link rel="stylesheet" href="http://zcms/theme/default/web.css" type="text/css" /> <script type="text/javascript" src="http://zcms/inc/web/js/lib.js"></script> </head><body onload="set_timeouts()"><div class="logo"><a href="http://zcms" title="http://zcms"><img src="http://zcms/theme/default/images/weblogo.gif" alt=""/></a></div><div class="header"><div class="text">Привет, гость!</div><a href="http://zcms/reg">Регистрация</a><a href="http://zcms/login">Вход</a></div><div class="layout"><div class="navigation"><a href="../news">Новости</a><a href="../guestbook">Гостевая</a><a href="../chat">Чат</a><a href="../articles">Статьи</a><a href="../info">Информация</a></div><div class="main"><div class="index"><h2><img src="../images/web/inform.png" alt="inform" class="down"/><a href="../info.php">Информация</a></h2> <b>Personal CMS</b>(Content management system, система управления контентом) -- бесплатная, с открытым кодом, постоянные обновления и улучшения. Имеет хорошую гибкость и большой функционал. Очень удобна для разработчиков, поскольку имеет библиотеку функций, позволяющую сэкономить много времени и сил на написание своих. <h3><img src="../images/web/news.png" alt="news" class="down"/><a href="../news">Новости</a></h3> Это блок, с помощью которого администрация сайта публикует различные новости о сайте. Новость состоит из заголовка и текста новости. Администратор также вправе прикрепить к новости файл. Пользователи могут комментировать новости(если это не запрещено администрацией).Также можно ставить к новостям пометки "Мне нравится". Если есть новая новость, то она автоматически отображается на всех страницах для всех пользователей, но её можно скрыть, кликнув по красном крестике справа от заголовка новости. Если новость была скрыта, а потом появилась новая новость, то новость опять будет отображатся на всех страницах пока вы её не скроете. Также можно зделать автоматическое скрытие новостей в настройках. В данном случае новости никогда не будут отображатся. <h3><img src="../images/web/guestbook.png" alt="guestbook" class="down"/><a href="../guestbook">Гостевая</a></h3> Это блок, назначение которого связь пользователей с администрацией. В гостевой могут писать и гости, но только если это разрешено администрацией. Администратор может ответить на ваше сообщение либо новым сообщением, либо подписью под вашим сообщением, которая выделяется другим цветом. <h3><img src="../images/web/chat.png" alt="chat" class="down"/><a href="../chat">Чат</a></h3> Думаю здесь обьяснения не требуются <h3><img src="../images/web/articles.png" alt="articles" class="down"/><a href="../articles">Статьи</a></h3> В этом блоке администрация может выкладывать статьи различного характера. За статьи можно голосовать и их можно комментировать. Если кликнуть на иконку печати справа от заголовка, то вы увидите версию для печати статьи, в которой убрано всё лишнее, не относящееся к статье. Если вы находитесь в какой-либо категории, вы можете выбрать режим сортировки(По дате(по умолчанию), по популярности и по имени). Всего есть 3 режима отображения статей: все статьи, новые и самые читаемые. <h3><img src="../images/web/profile.png" alt="profile" class="down"/><a href="../user/profile.php">Анкета</a></h3> В анкете выводится информация о пользователе и его контактная информация. У каждого пользователя есть стена(личная гостевая) и его статистика. Для каждого пользователя ведётся история входов c IP, где можно посмотреть с какого IP и когда заходили под даным ником</div></div><div class="sidebar"><div class="zag">Авторизация</div><div class="menu"><form action="../login.php?" method="POST"> <label for="login">Логин:</label><br/> <input type="text" name="login" id="login" maxwidth="15"/><br/> <label for="password">Пароль:</label><br/> <input type="password" name="pass" id="password" maxwidth="10"/><br/> <a href="http://zcms/reg">Регистрация</a><br/> <input type="submit" value="Войти"/> </form></div></div></div><div class="foot"> <a href="http://zcms" class="left">Главная</a> <a href="http://zcms/news">Новости</a> <a href="http://zcms/guestbook">Гостевая</a> <a href="http://zcms/chat">Чат</a> <a href="http://zcms/articles">Статьи</a> <a href="http://zcms/info">Информация</a> <a href="http://zcms/change_ver.php">WAP</a> </div></body></html> Вот CSS: body{max-width: 95%;} b.big{font-size: 100%;} textarea{width: 60%; height: 120px;} .err{ -moz-border-top-left-radius: 10px; /*Firefox*/ -webkit-border-top-left-radius: 10px; /*Chrome, Netscape*/ border-top-left-radius: 10px; /*IE, Opera*/ bottom: 0; right: 0; position: fixed; min-width: 200px; } .foot{ background-color: rgba(198,214,229,0.8); bottom: 0; left: 5%; width: 90%; position: fixed; -moz-border-radius: 10px 10px 0 0; -webkit-border-radius: 10px 10px 0 0; border-radius: 10px 10px 0 0; } .foot a{ display: block; height: 100%; float: left; min-width: 90px; border-right: 1px solid #a8ccf1; padding: 10px 5px; text-align: center; text-decoration: none; font-size: large; } .foot a.left{ -moz-border-radius: 10px 0 0 0; -webkit-border-radius: 10px 0 0 0; border-radius: 10px 0 0 0; } .foot a:hover{background-color: #c3d6ea;} .galarm{ background-color: #bff6ae; -moz-border-top-right-radius: 10px; /*Firefox*/ -webkit-border-top-right-radius: 10px; /*Chrome, Netscape*/ border-top-right-radius: 10px; /*IE, Opera*/ bottom: 0; left: 0; position: fixed; } .header{ background-color: #6890ba; -moz-border-radius: 0 0 10px 10px; /*Firefox*/ -webkit-border-radius: 0 0 10px 10px; /*Chrome, Netscape*/ border-radius: 0 0 10px 10px; /*IE, Opera*/ height: 25px; padding-top: 0; } .header a{ background-color: #a2bfdc; -moz-border-radius: 0 0 10px 10px; /*Firefox*/ -webkit-border-radius: 0 0 10px 10px; /*Chrome, Netscape*/ border-radius: 0 0 10px 10px; /*IE, Opera*/ cursor: pointer; display: block; float: right; margin-right: 3px; padding: 3px; text-align: center; text-decoration: none; top: 0; width: 80px; } .header a:hover{background-color: #b2cce7;} .header a.red{background-color: rgba(255, 212, 212, 0.9); color: #9b0808;} .header a.red:hover{background-color: rgb(255, 212, 212);} .header div.text{display: inline-block; margin: 6px;} .layout{ margin: auto; position: relative; width: 95%; } .layout div{position: absolute;} .logo{ background: url('images/logo-bg.png') top left #a2bfdc; padding: 20px 40px 20px 40px; text-align: left; } .main{ border: 4px solid #5a7fa6; border-top: 0px; left: 20%; right: 20%; } .main div{position: relative;} .main img.down{margin: 0 10px -10px 0;} .main .index{padding: 20px;} .navigation{right: 0; width: 20%;} .navigation a{ background-color: rgba(198,214,229,0.7); display: block; margin-bottom: 2px; padding: 5px; text-decoration: none; } .navigation a:hover{background-color: rgba(198,214,229,0.9);} .sidebar{left: 0; width: 20%;} .sidebar div{position: relative;} .sidebar a.login{text-decoration: none; font-size: large;} .sidebar .menu{background-color: #ebf3fb;} .sidebar .menu a.block{ background-color: #dbe6f1; display: block; font-size: medium; margin-top: 5px; padding: 5px 0; text-align: center; text-decoration: none; } .sidebar .menu a.block:hover{background-color: #cddae7;} .sidebar .menu input{width: 80%;} .sidebar .menu input[type=submit]{width: 50%;} .sidebar .zag{ background-color: #9ab3cd; color: #eaf4ff; display: block; font-size: large; padding: 7px; text-decoration: none; } .sidebar input[type=text]{background: url('images/login_bg.png') no-repeat 3px center #e0ebf6; padding-left: 21px;} .sidebar input[type=password]{background: url('images/pass_bg.png') no-repeat 3px center #e0ebf6; padding-left: 21px;} .zag{ font-size: large; padding: 5px; }
-
Всмысле?
-
Здравствуйте. Есть такая проблема: у меня есть фиксированый подвал, но он накрывает контент(Скриншот). Как мне зделать, чтобы контент поднялся выше подвала, если контент и боковые панели находятся в класе .layout, а подвал в .foot. Ниже приведен CSS Код .layout{ margin: auto; position: relative; width: 95%; } .foot{ background-color: rgba(198,214,229,0.8); bottom: 0; left: 5%; width: 90%; position: fixed; -moz-border-radius: 10px 10px 0 0; -webkit-border-radius: 10px 10px 0 0; border-radius: 10px 10px 0 0; } Если нужна дополнительная информация, пишите.
-
Здесь больше GDlib подойдёт. Во первых генерация будет быстрее, а во-вторых загружается уже изменённое изображение(думаю не нужно обьяснять чем это лучше). =)
-
А то, что у вас в портфолио хреновые сайты(по крайней мере внешне)--это так и задумано?