Боковая панель - HTML и CSS

vlad.md · 19.11.2011, 14:27

Доброго времени суток! Столкнулся с такой проблемой: немогу сделать
боковую панель для сайта. Если вам нетрудно напишите как сделать тукую панель
P.S.пример во вложении
Заранее благодарен!

Naive · 19.11.2011, 14:43

и в чем проблема? в верстке, позиционировании?
Для каких браузеров (нормальных или ie 6-8 тоже учитывается)?

vlad.md · 19.11.2011, 14:47

Цитата:

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

и в чем проблема? в верстке, позиционировании?
Для каких браузеров (нормальных или ie 6-8 тоже учитывается)?

Проблема в том что я немогу сделать такую обводку

Sherri113 · 19.11.2011, 17:37

делайте отдельным дивом,и в ксс прописывайте border: 2px outset #E6E6FA;это для примера строка.погуглите и найдите значения,нужные Вам.

ZvEr_HaCkEr · 19.11.2011, 18:02

Пользуйтесь

vlad.md · 19.11.2011, 20:31

Цитата:

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

Пользуйтесь

Большое спасибо! Но у меня возникла проблема когда пишу

Код:

*{margin:0;padding:0;}

у меня сайт выравнивается по левому краю, а когда убираю

Код:

margin:0;

сайт становиться по центру но меню становится "корявым". Что делать?

ZvEr_HaCkEr · 19.11.2011, 21:09

весь код в студию.

vlad.md · 19.11.2011, 21:14

Цитата:

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

весь код в студию.

Код бокового меню:

Код HTML:

<aside>
<div id="box">
<h2>Text</h2>
<div class="innerBox">
<p>Text</p>
<p>Text</p>
<p>Text</p>
<p>Text</p>
<p>Text</p>
</div>
</div>
</aside>

Код главной:

Код HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Главная страница</title>
<link href="style.css" rel="stylesheet" type="text/css">
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<style type="text/css">
<!--
.стиль1 {color: #CCCCCC}
.стиль2 {text-align:center; background: url(images/Line_menu.png) left top no-repeat;}
body {
	background-image: url(images/zzz.gif);
	background-repeat: repeat-x;
}
-->
</style>
</head>
<body>
<table width="965" height="809" border="0" align="center">
  <tr>
    <td height="114" colspan="3" align="center" valign="top"><?php include("header.html")?></td>
  </tr>
  <tr>
    <td height="44" colspan="3" align="center" valign="top"><span class="стиль1">
      <?php include("centr_menu.html") ?>
    </span></td>
  </tr>
  <tr>
    <td width="200" align="left" valign="top" class="current стиль1"><?php include("left_menu.html") ?></td>
    <td width="554" align="center" valign="top" class="current стиль1"><?php include("centr.php")?></td>
    <td width="197" align="center" valign="top" class="current стиль1"><?php include("right_menu.html") ?>    </td>
  </tr>
</table>
</body>
</html>

CSS :

PHP код:


			
/*Боковая панель*/

*{margin:0;padding:0;}

body{

font-family:Verdana,Tahoma,Arial;

width:100%;

height:100%;

}

aside{

float:right;

width:240px;

margin-right:0px;

position: relative;

}

#box{

background:rgba(229, 229, 229, 0.8);

padding: 10px;border-radius:15px;

-moz-border-radius:15px;

-webkit-border-radius:15px;

-khtml-border-radius:15px;

}

.innerBox {

background:#ffffff;

padding-bottom:20px;

border-radius:0 0 5px 5px;

text-align:centr;

}

h2 {

background:url(images/h2_bg.png) no-repeat;

width:220px;

height:42px;

line-height:40px;

color:#ffffff;

padding-right:10px;

font-size:14px;

text-shadow:1px 1px 1px #444444;

}

.innerBox p {

padding: 20px 10px;

padding-bottom: 0;

text-shadow:1px 1px 1px #dadada;

}

ZvEr_HaCkEr · 19.11.2011, 21:36

1)Кто ж так делает! Я привел пример кода с использованием html5, а у вас html4.01. aside замените на

Код:

 <div class="sidebar">......</div>

а в css

Код:

.sidebar{.............}

и уберите

Код:

<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>

2)Указывать имена классов в кириллице не рекомендуется, замените на .style1, .style2
3)Чтиво

vlad.md · 19.11.2011, 21:47

Большое спасибо! Разобрался.

19.11.2011, 14:43	#2
Naive Раздолбайских Дел Старожил Регистрация: 22.05.2009 Сообщений: 3,828	и в чем проблема? в верстке, позиционировании? Для каких браузеров (нормальных или ie 6-8 тоже учитывается)? Alar, верни репу!

19.11.2011, 21:36	#9
ZvEr_HaCkEr VisualC++/DirectX Форумчанин Регистрация: 16.07.2010 Сообщений: 831	1)Кто ж так делает! Я привел пример кода с использованием html5, а у вас html4.01. aside замените на Код: `<div class="sidebar">......</div>` а в css Код: `.sidebar{.............}` и уберите Код: `<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>` 2)Указывать имена классов в кириллице не рекомендуется, замените на .style1, .style2 3)Чтиво

19.11.2011, 21:47	#10
vlad.md Пользователь Регистрация: 27.05.2010 Сообщений: 50	Большое спасибо! Разобрался. Последний раз редактировалось vlad.md; 20.11.2011 в 10:50.

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
панель	Ko$	Общие вопросы Delphi	7	18.11.2011 09:23
Боковая форма	Gulik	Общие вопросы Delphi	5	18.10.2009 15:25
форма как в боковая потель с гаджетами	jocry	Общие вопросы Delphi	9	02.08.2009 19:28
Как создать программу-панель (как панель Msoffice), чтобы была поверх всех окон	Romanbl4	Общие вопросы Delphi	6	27.06.2007 17:23

19.11.2011, 17:37	#4
Sherri113 Регистрация: 17.11.2011 Сообщений: 4	делайте отдельным дивом,и в ксс прописывайте border: 2px outset #E6E6FA;это для примера строка.погуглите и найдите значения,нужные Вам.

19.11.2011, 21:09	#7
ZvEr_HaCkEr VisualC++/DirectX Форумчанин Регистрация: 16.07.2010 Сообщений: 831	весь код в студию.