Перейти до вмісту
Пошук в
  • Детальніше...
Шукати результати, які ...
Шукати результати в ...

Привязать стили меню к стилю header

Steel123

Автор: ,
в Дизайн, верстка та шаблони

 Share

Recommended Posts

Steel123 Apprentice

Steel123

Опубліковано:
Опубліковано:

Шаблон не дефолтный. Ситуация такова, нужно зафиксировать header вверху, и сделать резиновым. Проблем с fixed не было, но вот всплыло две проблемы. 

1) Меню ни в какую не хочет становиться резиновым(точнее хочет но левый отступ по классу container) и хоть убей. Замучался уже.

2)Блок container заходит под зафиксированную шапку и меню. Вариации с top не прошли, наверное не там вставляю значение.

 

 

Помогите разобраться. Ссылка на сайт iammodish.ru

 


html {
	overflow: -moz-scrollbars-vertical;
	margin: 0;
	padding: 0;
}
body {
	background: #020001 url(../image/fon.png) 0% 0%/cover no-repeat fixed;
	height: 100%;
 min-width: 1000px;
 overflow-y: scroll;
 color: #f8f8f8;
 font-family: Arial, Helvetica, sans-serif;
 margin: 0px;
 padding: 0px;
}
body, td, th, input, textarea, select, a {
	font-size: 12px;
	color: #c3c3c3;
}
h1, .welcome {
	color: #ffffff;
	font-family: Verdana;
	margin-top: 0px;
	margin-bottom: 20px;
	font-size: 32px;
	font-weight: normal;
	text-shadow: 0 0 1px rgba(0, 0, 0, .01);
}
h2 {
	color: #f8f8f8;
	font-size: 16px;
	margin-top: 0px;
	margin-bottom: 5px;
	padding-bottom: 8px;
}
p {
	margin-top: 0px;
	margin-bottom: 20px;
}
a, a:visited, a b {
	color: #c3c3c3;
	text-decoration: underline;
	cursor: pointer;
}
a:hover {
	color: #FF0000;
	text-decoration: none;
	-webkit-transition: all 0.3s ease-in;
    -moz-transition: all 0.3s ease-in;
	-o-transition: all 0.3s ease-in;
}
a img {
	border: none;
}
form {
	padding: 0;
	margin: 0;
	display: inline;
}
input[type=text], input[type=password], textarea {
	background: #555555;
border: 1px solid #2d2d2d;
box-shadow: inset 0px 2px 4px rgba(0, 0, 0, 0.298);
margin-left: 0px;
margin-right: 0px;
padding: 3px;
}
input:focus {
	background: #444444;
}
select {
	background: #555555;
	border: 1px solid #2d2d2d;
	padding: 2px;
}
label {
	cursor: pointer;
}
/* layout */
#container {
	width: 980px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}
#column-left {
	background: #202020;
	float: left;
	width: 195px;
	text-align: center;
	border-radius: 0px 0px 0px 30px;
	margin-bottom: 20px;
}
#column-right {
	background: #202020;
	float: right;
	width: 195px;
	text-align: center;
	border-radius: 0px 0px 30px 0px;
	margin-bottom: 20px;
}
#content {
	background: #202020;
	min-height: 400px;
	margin-bottom: 20px;
	padding: 15px;
	
}
#column-left + #column-right + #content, #column-left + #content {
	margin-left: 195px;
} 
#column-right + #content {
	margin-right: 195px;
}
/* header */
#header {
	background: url(../image/hed.png) bottom center repeat;
	height: 145px;
	margin-bottom: auto;
	padding-bottom: auto;
	position: fixed;
	z-index: 99;
	width: 100%;
margin-left: auto;
margin-right: auto;
text-align: left;
}
#header #logo {
	left: 15px;
    position: fixed;
    top: 70px;
}
#language {
	position: absolute;
	top: 217px;
	left: 917px;
	width: 45px;
	color: #999;
	line-height: 17px;
	z-index: 7;
}
#language img {
	cursor: pointer;
	margin-right: 5px;
}
#currency {
	color: #999999;
left: 900px;
line-height: 17px;
position: absolute;
top: 63px;
width: 75px;
z-index: 7;
}
#currency a {
	display: inline-block;
	padding: 2px 4px;
	color: #c3c3c3;
	text-decoration: none;
	margin-right: 2px;
	margin-bottom: 2px;
}
#currency a b {
	color: #ff0000;
	text-decoration: none;
}
#nomer {
	background: url(../image/phone-solid.png) top center no-repeat;
	position: fixed;
	left: 830px;
	top: 0px;
	width: 150px;
	line-height: 20px;
	font-size: 0px;
    font-style: italic;
    font-weight: 400;
	text-align: center;
	padding-top: 0px; 
}
#nomer:hover {
	font-size: 15px;
	padding-top: 20px;
	-moz-transition: all 0.7s;
	-webkit-transition: all 0.7s;
	-o-transition: all 0.7s;
	transition: all 0.7s;
}
#header #cart {
	position: fixed;
	top: 70px;
	right: 15px;
	z-index: 9;
	min-width: 250px;
}
#header #cart .heading {
	float: right;
	margin-right: 0px;
	margin-top: 12px;
	padding: 0px;
	position: relative;
	z-index: 1;
}
#header #cart .heading h4 {
	color: #333333;
	font-size: 15px;
	font-weight: bold;
	margin-top: 0px;
	margin-bottom: 3px;
}
#header #cart .heading a {
	background: #232323 url(../image/arrow-down.png) right center no-repeat;
	color: #ff0000;
	text-decoration: none;
	padding: 24px 22px 22px 22px;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size: 16px;
	font-weight: 100;
	border: 1px solid #2d2d2d;
	 box-shadow: inset 0px 3px 8px rgba(0, 0, 0, 0.298);
}
#header #cart .heading a span {
	background: none;
	padding: 14px 100px 14px 35px;
}
#header #cart .content {
	clear: both;
	display: none;
	position: relative;
	top: 17px;
	padding: 8px;
	min-height: 56px;
	background: #555555;
	border: 1px solid #2D2D2D;
box-shadow: inset 0px 0px 6px #101010;
}
#header #cart.active .heading {
	margin-top: 2px;
	padding-top: 10px;
	padding-bottom: 6px;
	z-index: 999;
}
#header #cart.active .content {
	display: block;
}
.mini-cart-info table {
	border-collapse: collapse;
	width: 100%;
	margin-bottom: 5px;
}
.mini-cart-info td {
	color: #c3c3c3;
	vertical-align: top;
	padding: 10px 5px;
	border-bottom: 1px solid #2d2d2d;
}
.mini-cart-info .image {
	width: 1px;
}
.mini-cart-info .image img {
	background: #f8f8f8;
	border: 1px solid #2d2d2d;
	text-align: left;
}
.mini-cart-info .name small {
	color: #666;
}
.mini-cart-info .quantity {
	text-align: right;
}
.mini-cart-info td.total {
	text-align: right;
}
.mini-cart-info .remove {
	text-align: right;
}
.mini-cart-info .remove img {
	cursor: pointer;
}
.mini-cart-total {
	text-align: right;
}
.mini-cart-total table {
	border-collapse: collapse;
	display: inline-block;
	margin-bottom: 5px;
}
.mini-cart-total td {
	color: #c6c6c6;
	padding: 4px;
}
#header #cart .checkout {
	text-align: right;
	clear: both;
}
#header #cart .empty {
	padding-top: 0px;
	text-align: center;
}
#header #search {
	background: url(../image/header-right.png) top repeat-x;
	position: fixed;
	height: 43px;
	top: 0px;
	right: 0px;
	padding-right: 145px;
	width: 252px;
	z-index: 5;
}
#header .button-search {
	position: absolute;
	left: 0px;
	background: url('../image/button-search.png') center no-repeat;
	width: 16px;
	height: 29px;
	margin-top: 8px;
	margin-left: 8px;
	cursor: pointer;
}
#header .button-search:hover {
	background: url(../image/button-search2.png) no-repeat;
}
#header #search input {
	background: #232323;
	padding: 1px 5px 1px 10px;
	color: #c3c3c3;
	width: 345px;
	height: 25px;
	border: 1px solid #2D2D2D;
    box-shadow: inset 0px 3px 4px rgba(0, 0, 0, 0.298);
	margin-top: 8px;
	margin-left: 27px; 
}
#header #search input:focus {
	 background-color: #2f2f2f;
}
#header #welcome {
	position: absolute;
	top: 0px;
	right: 0px;
	z-index: 5;
	width: 298px;
	text-align: right;
	color: #999999;
}
#header .links {
	background: url(../image/verh2.png) repeat-x;
	position: fixed;
	width: 100%;
	float: left;
	top: 0px;
	height: 44px;
	font-size: 10px;
}
#header .links a {
	float: left;
	display: block;
	border-right: 1px solid #2b2b2b;
	padding: 14px 15px 15px 15px;
	color: #c3c3c3;
	text-decoration: none;
	font-size: 12px;
}
#header .links a:hover {
	background: url(../image/verh2.png) 0px -44px repeat-x;
	-o-transition: all 0.5s linear;
	-webkit-transition: all 0.5s linear;
	-moz-transition: all 0.5s linear;
	-khtml-transition: all 0.5s linear;
	color: #ffffff;
}
/* menu */
#menu {
	background: url(../image/meny2.png) repeat-x;
	height: 57px;
	border-bottom: 1px solid #000000;
	margin-bottom: 0px;
	padding: 0px;
	width: 100%;
margin-left: 0px;
margin-right: auto;
text-align: left;
position: fixed;
top: 145px;


}
#menu ul {
	list-style: none;
	margin: 0;
	padding: 2px;
}
#menu > ul > li {
	position: relative;
	float: left;
	z-index: 20;	
	padding: 0px;
}
#menu > ul > li:hover {
	background: url(../image/meny2.png) 0px -57px repeat-x;
	color: #ffffff;
	-o-transition: all 0.5s linear;
	-webkit-transition: all 0.5s linear;
	-moz-transition: all 0.5s linear;
	-khtml-transition: all 0.5s linear;
}
#menu > ul > li > a.active {
	background: url(../image/hov.png) repeat-x;
}
#menu > ul > li > a {
	font-size: 13px;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	color: #f8f8f8;
	line-height: 24px;
	text-decoration: none;
	text-transform:uppercase;
	display: block;
	border-right: 1px solid #2b2b2b;
	padding: 16px 15px 15px 15px;
	margin-bottom: 0px;
	z-index: 6;
	position: relative;
}
#menu > ul > li > div {
	display: none;
	position: absolute;
	z-index: 5;
	padding: 5px;
	border: 1px solid #2d2d2d;
	-webkit-border-radius: 0px 0px 5px 5px;
	-moz-border-radius: 0px 0px 5px 5px;
	-khtml-border-radius: 0px 0px 5px 5px;
	border-radius: 0px 0px 5px 5px;
	background-color: #2F2F2F;
	 box-shadow: inset 0px 0px 6px #101010;
}
#menu > ul > li:hover > div {
	display: table;
}
#menu > ul > li > div > ul {
	display: table-cell;
}
#menu > ul > li ul + ul {
	padding-left: 20px;
}
#menu > ul > li ul > li > a {
	background: url(../image/button3.png) repeat-x;
	text-decoration: none;
	padding: 4px;
	color: #c3c3c3;
	display: block;
	white-space: nowrap;
	min-width: 120px;
}
#menu > ul > li ul > li > a:hover {
	background: url('../image/button3.png') 0px -30px repeat-x;
	transition: all 0.5s linear;
}
#menu > ul > li > div > ul > li > a {
	color: #FFFFFF;
	
}

.breadcrumb {
	color: #CCCCCC;
	margin-bottom: 10px;
}
.success, .warning, .attention, .information {
	padding: 10px 10px 10px 33px;
	margin-top: 2px;
	margin-bottom: 2px;
	color: #c3c3c3;
	-webkit-border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	-khtml-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
}
.success {
	background: #323232 url('../image/success.png') 10px center no-repeat;
	border: 1px solid #ff0000;
	-webkit-border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	-khtml-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
}
.warning {
	background: #323232 url('../image/warning.png') 10px center no-repeat;
	border: 1px solid #ff0000;
	-webkit-border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	-khtml-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
}
.attention {
	background: #323232 url('../image/attention.png') 10px center no-repeat;
	border: 1px solid #ff0000;
	-webkit-border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	-khtml-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
}
.success .close, .warning .close, .attention .close, .information .close {
	float: right;
	padding-top: 4px;
	padding-right: 4px;
	cursor: pointer;
}
.required {
	color: #FF0000;
	font-weight: bold;
}
.error {
	display: block;
	color: #FF0000;
}
.help {
	color: #999;
	font-size: 10px;
	font-weight: normal;
	font-family: Verdana, Geneva, sans-serif;
	display: block;
}
table.form {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 20px;
}
table.form tr td:first-child {
	width: 150px;
}
table.form > * > * > td {
	color: #f8f8f8;
}
table.form td {
	padding: 4px;
}
input.large-field, select.large-field {
	width: 300px;
}
table.list {
	border-collapse: collapse;
	width: 100%;
	border-top: 1px solid #2d2d2d;
	border-left: 1px solid #2d2d2d;
	margin-bottom: 20px;
}
table.list td {
	border-right: 1px solid #2d2d2d;
	border-bottom: 1px solid #2d2d2d;
}
table.list thead td {
	background-color: #323232;
	padding: 0px 5px;
}
table.list thead td a, .list thead td {
	text-decoration: none;
	color: #c3c3c3;
	font-weight: bold;
}
table.list tbody td {
	vertical-align: top;
	padding: 0px 5px;
}
table.list .left {
	text-align: left;
	padding: 7px;
}
table.list .right {
	text-align: right;
	padding: 7px;
}
table.list .center {
	text-align: center;
	padding: 7px;
}
table.radio {
	width: 100%;
	border-collapse: collapse;
}
table.radio td {
	padding: 5px;
	vertical-align: top;
}
table.radio td label {
	display: block;
}
table.radio tr td:first-child {
	width: 1px;
}
table.radio tr td:first-child input {
	margin-top: 1px;
}
table.radio tr.highlight:hover td {
	background: #232323;
	cursor: pointer;
}
.pagination {
	border: 1px solid #2D2D2D;
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.298);
display: inline-block;
margin-bottom: 10px;
padding-top: 8px;
padding-bottom: 10px;
width: 100%;
}
.pagination .links {
	float: left;
}
.pagination .links a {
	display: inline-block;
	border: 1px solid #2d2d2d;
	padding: 4px 10px;
	text-decoration: none;
	color: #A3A3A3;
}
.pagination .links b {
	display: inline-block;
	border: 1px solid #269BC6;
	padding: 4px 10px;
	font-weight: normal;
	text-decoration: none;
	color: #269BC6;
	background: #FFFFFF;
}
.pagination .results {
	float: right;
	padding-top: 3px;
	padding-right: 16px;
}
/* button */
a.button, input.button {
	cursor: pointer;
	color: #f8f8f8;
	line-height: 12px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	background: url('../image/button11.png') top left no-repeat;
}
a.button {
	display: inline-block;
	text-decoration: none;
	padding: 6px 15px 6px 15px;
}
input.button {
	margin: 0;
	border: 0;
	height: 30px;
	padding: 0px 24px 0px 24px;
}
a.button:hover, input.button:hover {
	background: url('../image/button11.png') 0px -170px no-repeat;
	-o-transition: all 1s linear;
	-webkit-transition: all 1s linear;
	-moz-transition: all 1s linear;
	-khtml-transition: all 1s linear;
}
.buttons {
	border: 1px solid #2d2d2d;
	overflow: auto;
	padding: 6px;
	margin-bottom: 20px;
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.298);
}
.buttons .left {
	float: left;
	text-align: left;
}
.buttons .right {
	color: #c3c3c3;
	float: right;
	text-align: right;
}
.buttons .center {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
.htabs {
	height: 30px;		
	line-height: 16px;
	border-bottom: 1px solid #2d2d2d;	
}
.htabs a {
	border-top: 1px solid #2d2d2d;
	border-left: 1px solid #2d2d2d;
	border-right: 1px solid #2d2d2d; 
	background: #FFFFFF url('../image/button2.png') repeat-x;
	padding: 7px 15px 6px 15px;
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	color: #c3c3c3;
	margin-right: 2px;
	display: none;
}
.htabs a:hover {
    background: url('../image/button2.png') 0px -30px repeat-x;
	transition: all 0.7s linear;
}
.htabs a.selected {
	padding-bottom: 7px;
	background: url(../image/button-active.png) repeat-x;
}
.tab-content {
	border-left: 1px solid #2d2d2d;
	border-right: 1px solid #2d2d2d;
	border-bottom: 1px solid #2d2d2d;
	padding: 10px;
	margin-bottom: 20px;
	z-index: 2;
	overflow: auto;
	box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.298);
}
/* box */
.box {
	margin-bottom: 20px;
}
.box .box-heading {
	background: url('../image/background.png') no-repeat;
	padding: 15px 10px 13px 10px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 17px;
	font-weight: bold;
	line-height: 14px;
	color: #c3c3c3;
}
.box .box-content {
	background: #202020;
	padding: 10px;
	border-radius: 0px 0px 30px 30px;
}
/* box products */
.box-product {
	width: 100%;
	overflow: hidden;
}
.box-product > div {
	background: #202020;
	border: 1px solid #2d2d2d;
display: inline-block;
margin-bottom: 13px;
margin-left: 10px;
margin-right: 9px;
padding: 7px 7px 15px 7px;
text-align: center;
vertical-align: top;
width: 195px;
box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.298);
}
#column-left .box-product > div, #column-right .box-product > div { 
display: inline-block;
margin-bottom: 15px;
margin-left: 8px;
padding-top: 3px;
text-align: center;
vertical-align: top;
width: 130px;
}
#column-left + #column-right + #content .box-product > div {
	width: 143px;
}
.box-product .image {
	display: block;
	margin-bottom: 0px;
}
.box-product .image img {
	background: url(../image/pnts.png) 0% 0%/cover no-repeat transparent;
	margin-top: 10px;
	margin-bottom: 8px;
	padding: 3px;
	border: 1px solid transparent;
}
.box-product .image img:hover {
	background: none;
     border: 1px solid #2D2D2D;
     box-shadow: 0px 0px 8px #0c0c0c;
    -o-transition: all 0.7s linear;
	-webkit-transition: all 0.7s linear;
	-moz-transition: all 0.7s linear;
	-khtml-transition: all 0.7s linear;
}
.box-product .name a {
	color: #38B0E3;
	font-weight: bold;
	text-decoration: none;
	display: block;
	margin-bottom: 4px;
}
.box-product .price {
	display: block;
	font-family: "Times New Roman", Times, serif;
	font-weight: 700;
	color: #ffffff;
	margin-bottom: 4px;
	min-height: 30px;
}
.box-product .price-old {
	color: #F00;
	text-decoration: line-through;
}
.box-product .price-new {
	font-weight: bold;
}
.box-product .rating {
	display: block;
	margin-bottom: 4px;
}
/* box category */
.box-category {
	margin-top: -5px;
	text-align: left;
}
.box-category ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.box-category > ul > li {
	border: 1px solid #2d2d2d;
	padding: 8px 8px 8px 8px;
}
.box-category > ul > li + li {
	border: 1px solid #2d2d2d;
	box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.298);
}
.box-category > ul > li > a {
	text-decoration: none;
	color: #cccccc;
}
.box-category > ul > li > a:hover {
	color: #ff0000;
}
.box-category > ul > li ul {
	display: none;
}
.box-category > ul > li a.active {
	font-weight: bold;
}
.box-category > ul > li a.active + ul {
	display: block;
}
.box-category > ul > li ul > li {
	padding: 5px 5px 0px 10px;
}
.box-category > ul > li ul > li > a {
	text-decoration: none;
	display: block;
}
.box-category > ul > li ul > li > a.active {
	font-weight: bold;
}
/* content */
#content .content {
	padding: 10px;
	overflow: auto;
	margin-bottom: 20px;
	border: 1px solid #2d2d2d;
	box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.298);
}
#content .content .left {
	float: left;
	width: 49%;
}
#content .content .right {
	float: right;
	width: 49%;
}
/* category */
.category-info {
	overflow: auto;
	margin-bottom: 20px;
}
.category-info .image {
	float: left;
	padding: 5px;
	margin-right: 15px;
	border: 1px solid #2d2d2d;
	box-shadow: inset 0px 0px 4px #232323;
}
.category-list {
	overflow: auto;
	margin-bottom: 20px;
}
.category-list ul {
	float: left;
	width: 18%;
}
/* manufacturer */
.manufacturer-list {
	border: 1px solid #2d2d2d;
	padding: 5px;
	overflow: auto;
	margin-bottom: 20px;
	box-shadow: inset 0px 0px 8px #646464;
}
.manufacturer-heading {
	background: #323232;
	font-size: 15px;
	font-weight: bold;
	padding: 5px 8px;
	margin-bottom: 6px;
}
.manufacturer-content {
	padding: 8px;
}
.manufacturer-list ul {
	float: left;
	width: 25%;
	margin: 0;
	padding: 0;
	list-style: none;
	margin-bottom: 10px;
}
/* product */
.product-filter {
	border-bottom: 1px solid #2d2d2d;
	padding-bottom: 5px;
	overflow: auto;
}
.product-filter .display {
	margin-right: 15px;
	float: left;
	padding-top: 4px;
	color: #c3c3c3;
}
.product-filter .display a {
	font-weight: bold;
}
.product-filter .sort {
	float: right;
	color: #c3c3c3;
}
.product-filter .limit {
	margin-left: 15px;
	float: right;
	color: #c3c3c3;
}
.product-compare {
	padding-top: 6px;
	margin-bottom: 25px;
	font-weight: bold;
}
.product-compare a {
	text-decoration: none;
	font-weight: bold;
}
.product-list > div {
	overflow: auto;
	margin-bottom: 15px;
	padding: 16px;
	border: 1px solid #2D2D2D;
box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.298);
}
.product-list .right {
	float: right;
	margin-left: 15px;
}
.product-list > div + div {
border: 1px solid #2D2D2D;
box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.298);
padding: 16px;
}
.product-list .image {
	float: left;
	margin-right: 10px;
}
.product-list .image img {
	padding: 3px;
	border: 1px solid #2d2d2d;
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.298);
}
.product-list .name {
	margin-bottom: 3px;
}
.product-list .name a {
	color: #f8f8f8;
	font-weight: bold;
	text-decoration: none;
}
.product-list .description {
	line-height: 15px;
	margin-bottom: 5px;
	color: #cccccc;
}
.product-list .rating {
	color: #7B7B7B;
}
.product-list .price {
	float: right;
	height: 50px;
	margin-left: 8px;
	text-align: right;
	color: #f8f8f8;
	font-size: 12px;
}
.product-list .price-old {
	color: #F00;
	text-decoration: line-through;
}
.product-list .price-new {
	font-weight: bold;
}
.product-list .price-tax {
	font-size: 12px;
	font-weight: normal;
	color: #BBBBBB;
}
.product-list .cart {
	margin-bottom: 3px;
}
.product-list .wishlist, .product-list .compare {
	margin-bottom: 3px;
}
.product-list .wishlist a {
	color: #c3c3c3;
	text-decoration: none;
	padding-left: 18px;
	display: block;
	background: url('../image/add.png') left center no-repeat;
}
.product-list .wishlist a:hover {
	color: #ff0000;
}
.product-list .compare a {
	color: #c3c3c3;
	text-decoration: none;
	padding-left: 18px;
	display: block;
	background: url('../image/add.png') left 60% no-repeat;
}
.product-list .compare a:hover {
	color: #ff0000;
}
.product-grid {
	text-align: center;
	width: 100%;
	overflow: auto;
}
.product-grid > div {
	width: 160px;
	display: inline-block;
	vertical-align: top;
	margin-left: 10px;
    margin-right: 10px;
	margin-bottom: 15px;
	padding-top: 15px;
	padding-bottom: 20px;
	text-align: center;
	border: 1px solid #2D2D2D;
    box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.298);
}
#column-left + #column-right + #content .product-grid > div {
	width: 160px;
}
.product-grid .image {
	display: block;
	margin-bottom: 0px;
}
.product-grid .image img {
	background: url(../image/pnts.png) center no-repeat;
	padding: 3px;
	border: 1px solid #2d2d2d;
}
.product-grid .name a {
	color: #38B0E3;
	font-weight: bold;
	text-decoration: none;
	display: block;
	min-height: 30px;
	margin-bottom: 4px;
}
.product-grid .description {
	display: none;
}
.product-grid .rating {
	display: block;
	margin-bottom: 4px;
}
.product-grid .price {
	display: block;
	font-weight: bold;
	color: #f8f8f8;
	margin-bottom: 4px;
}
.product-grid .price-old {
	color: #F00;
	text-decoration: line-through;
}
.product-grid .price-new {
	font-weight: bold;
}
.product-grid .price .price-tax {
	display: none;
}
.product-grid .cart {
	margin-bottom: 3px;
}
.product-grid .wishlist, .product-grid .compare {
	margin-bottom: 3px;
}
.product-grid .wishlist a {
	color: #c3c3c3;
	text-decoration: none;
	margin-left: 10px;
	padding-left: 0px;
	display: block;
	background: url('../image/add.png') left center no-repeat;
}
.product-grid .compare a {
	color: #c3c3c3;
	text-decoration: none;
	margin-left: 10px;
	padding-left: 0px;
	display: block;
	background: url('../image/add.png') left center no-repeat;
}
/* Product */
.product-info {
	overflow: auto;
	margin-bottom: 20px;
}
.product-info > .left {
	float: left;
	margin-right: 15px;
}
.product-info > .left + .right {
	margin-left: 265px;
}
.product-info .image {
	border: 1px solid #2d2d2d;
	float: left;
	margin-bottom: 20px;
	padding: 10px;
	text-align: center;
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.298);
}
.product-info .image-additional {
	width: 260px;
	;
	clear: both;
	overflow: hidden;
}
.product-info .image-additional img {
	border: 1px solid #E7E7E7;
}
.product-info .image-additional a {
	float: left;
	display: block;
	margin-left: 10px;
	margin-bottom: 10px;
}
.product-info .description {
	border: 1px solid #2d2d2d;
	padding: 10px;
	margin-bottom: 10px;
	line-height: 20px;
	color: #c3c3c3;
	box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.298);
}
.product-info .description span {
	color: #38B0E3;
}
.product-info .description a {
	color: #c3c3c3;
	text-decoration: none;
}
.product-info .price {
	overflow: auto;
	border: 1px solid #2d2d2d;
	padding: 10px;
	margin-bottom: 10px;
	font-size: 15px;
	font-weight: bold;
	color: #c3c3c3;
	box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.298);
}
.product-info .price-old {
	color: #F00;
	text-decoration: line-through;
}
.product-info .price-new {
}
.product-info .price-tax {
	font-size: 12px;
	font-weight: normal;
	color: #999;
}
.product-info .price .reward {
	font-size: 12px;
	font-weight: normal;
	color: #999;
}
.product-info .price .discount {
	font-weight: normal;
	font-size: 12px;
	color: #c3c3c3;
}
.product-info .options {
	border: 1px solid #2d2d2d;
	padding: 10px;
	margin-bottom: 10px;
	color: #c3c3c3;
	box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.298);
}
.product-info .option-image {
	margin-top: 3px;
	margin-bottom: 10px;
}
.product-info .option-image label {
	display: block;
	width: 100%;
	height: 100%;
}
.product-info .option-image img {
	margin-right: 5px;
	border: 1px solid #CCCCCC;
	cursor: pointer;
}
.product-info .cart {
	border: 1px solid #2d2d2d;
	padding: 10px 5px 10px 0px;
	margin-bottom: 20px;
	color: #c3c3c3;
	overflow: auto;
	box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.298);
}
.product-info .cart div {
	float: left;
	vertical-align: middle;
	margin-left: 7px;
}
.product-info .cart div > span {
	padding-top: 7px;
	display: block;
	color: #999;
}
.product-info .cart .minimum {
	padding-top: 5px;
	font-size: 11px;
	color: #999;
	clear: both;
}
.product-info .review {
	color: #c3c3c3;
	border: 1px solid #2d2d2d;
	margin-bottom: 10px;
	box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.298);
}
.product-info .review > div {
	padding: 8px;
	line-height: 20px;
}
.product-info .review > div > span {
	color: #38B0E3;
}
.product-info .review .share {
	overflow: auto;
	line-height: normal;
}
.product-info .review .share a {
	text-decoration: none;
}
.review-list {
	padding: 10px;
	overflow: auto;
	margin-bottom: 20px;
	border: 1px solid #2d2d2d;
}
.review-list .author {
	float: left;
	margin-bottom: 20px;
}
.review-list .rating {
	float: right;
	margin-bottom: 20px;
}
.review-list .text {
	clear: both;
}
.attribute {
	border-collapse: collapse;
	width: 100%;
	border-top: 1px solid #2d2d2d;
	border-left: 1px solid #2d2d2d;
	margin-bottom: 20px;
}
.attribute thead td, .attribute thead tr td:first-child {
	background: #202020;
	color: #c3c3c3;
	font-size: 14px;
	font-weight: bold;
	text-align: left;
}
.attribute tr td:first-child {
	color: #c3c3c3;
	font-weight: bold;
	text-align: right;
	width: 20%;
}
.attribute td {
	padding: 7px;
	color: #f8f8f8;
	text-align: center;
	vertical-align: top;
	border-right: 1px solid #2d2d2d;
	border-bottom: 1px solid #2d2d2d;
}
.compare-info {
	border-collapse: collapse;
	width: 100%;
	border-top: 1px solid #2d2d2d;
	border-left: 1px solid #2d2d2d;
	margin-bottom: 20px;
}
.compare-info thead td, .compare-info thead tr td:first-child {
	color: #c3c3c3;
	font-size: 14px;
	font-weight: bold;
	background: #202020;
	text-align: left;
}
.compare-info tr td:first-child {
	color: #c3c3c3;
	font-weight: bold;
	text-align: right;
}
.compare-info td {
	padding: 7px;
	width: 20%;
	color: #c3c3c3;
	text-align: center;
	vertical-align: top;
	border-right: 1px solid #2d2d2d;
	border-bottom: 1px solid #2d2d2d;
}
.compare-info .name a {
	font-weight: bold;
}
.compare-info .price-old {
	font-weight: bold;
	color: #F00;
	text-decoration: line-through;
}
.compare-info .price-new {
	font-weight: bold;
}
/* wishlist */
.wishlist-info table {
	width: 100%;
	border-collapse: collapse;
	border-top: 1px solid #2d2d2d;
	border-left: 1px solid #2d2d2d;
	border-right: 1px solid #2d2d2d;
	margin-bottom: 20px;
}
.wishlist-info td {
	padding: 7px;
}
.wishlist-info thead td {
	color: #c3c3c3;
	font-weight: bold;
	background-color: #F7F7F7;
	border-bottom: 1px solid #2d2d2d;
}
.wishlist-info thead .image {
	text-align: center;
}
.wishlist-info thead .name, .wishlist-info thead .model, .wishlist-info thead .stock {
	text-align: left;
}
.wishlist-info thead .quantity, .wishlist-info thead .price, .wishlist-info thead .total, .wishlist-info thead .action {
	text-align: right;
}
.wishlist-info tbody td {
	vertical-align: top;
	border-bottom: 1px solid #2d2d2d;
}
.wishlist-info tbody .image img {
	border: 1px solid #2d2d2d;
}
.wishlist-info tbody .image {
	text-align: center;
}
.wishlist-info tbody .name, .wishlist-info tbody .model, .wishlist-info tbody .stock {
	text-align: left;
}
.wishlist-info tbody .quantity, .wishlist-info tbody .price, .wishlist-info tbody .total, .wishlist-info tbody .action {
	text-align: right;
}
.wishlist-info tbody .price s {
	color: #F00;
}
.wishlist-info tbody .action img {
	cursor: pointer;
}
.login-content {
	margin-bottom: 20px;
	overflow: auto;
}
.login-content .left {
	float: left;
	width: 48%;
}
.login-content .right {
	float: right;
	width: 48%
}
.login-content .left .content, .login-content .right .content {
	min-height: 190px;
}
/* orders */
.order-list {
	margin-bottom: 10px;
}
.order-list .order-id {
	width: 49%;
	float: left;
	margin-bottom: 2px;
}
.order-list .order-status {
	width: 49%;
	float: right;
	text-align: right;
	margin-bottom: 2px;
}
.order-list .order-content {
	padding: 10px 0px;
	display: inline-block;
	width: 100%;
	margin-bottom: 20px;
	border-top: 1px solid #2d2d2d;
	border-bottom: 1px solid #2d2d2d;
}
.order-list .order-content div {
	float: left;
	width: 33.3%;
}
.order-list .order-info {
	text-align: right;
}
.order-detail {
	background: #EFEFEF;
	font-weight: bold;
}
/* returns */
.return-list {
	margin-bottom: 10px;
}
.return-list .return-id {
	width: 49%;
	float: left;
	margin-bottom: 2px;
}
.return-list .return-status {
	width: 49%;
	float: right;
	text-align: right;
	margin-bottom: 2px;
}
.return-list .return-content {
	padding: 10px 0px;
	display: inline-block;
	width: 100%;
	margin-bottom: 20px;
	border-top: 1px solid #2d2d2d;
	border-bottom: 1px solid #2d2d2d;
}
.return-list .return-content div {
	float: left;
	width: 33.3%;
}
.return-list .return-info {
	text-align: right;
}
.return-product {
	overflow: auto;
	margin-bottom: 20px;
}
.return-name {
	float: left;
	width: 31%;
	margin-right: 15px;
}
.return-model {
	float: left;
	width: 31%;
	margin-right: 15px;
}
.return-quantity {
	float: left;
	width: 31%;
}
.return-detail {
	overflow: auto;
	margin-bottom: 20px;
}
.return-reason {
	float: left;
	width: 31%;
	margin-right: 15px;
}
.return-opened {
	float: left;
	width: 31%;
	margin-right: 15px;
}
.return-opened textarea {
	width: 98%;
	vertical-align: top;
}
.return-captcha {
	float: left;
}
.download-list {
	margin-bottom: 10px;
}
.download-list .download-id {
	width: 49%;
	float: left;
	margin-bottom: 2px;
}
.download-list .download-status {
	width: 49%;
	float: right;
	text-align: right;
	margin-bottom: 2px;
}
.download-list .download-content {
	padding: 10px 0px;
	display: inline-block;
	width: 100%;
	margin-bottom: 20px;
	border-top: 1px solid #2d2d2d;
	border-bottom: 1px solid #2d2d2d;
}
.download-list .download-content div {
	float: left;
	width: 33.3%;
}
.download-list .download-info {
	text-align: right;
}
/* cart */
.cart-info table {
	width: 100%;
	margin-bottom: 15px;
	border-collapse: collapse;
	border: 1px solid #2D2D2D;
box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.298);
}
.cart-info td {
	padding: 7px;
}
.cart-info thead td {
	color: #c3c3c3;
	font-weight: bold;
	background-color: #333333;
	border-bottom: 1px solid #2D2D2D;
}
.cart-info thead .image {
	text-align: center;
}
.cart-info thead .name, .cart-info thead .model, .cart-info thead .quantity {
	text-align: left;
}
.cart-info thead .price, .cart-info thead .total {
	text-align: right;
}
.cart-info tbody td {
	vertical-align: top;
	border-bottom: 1px solid #2D2D2D;
}
.cart-info tbody .image img {
	border: 1px solid #2d2d2d;
	box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.298);
}
.cart-info tbody .image {
	text-align: center;
}
.cart-info tbody .name, .cart-info tbody .model, .cart-info tbody .quantity {
	text-align: left;
}
.cart-info tbody .quantity input[type=image], .cart-info tbody .quantity img {
	position: relative;
	top: 4px;
	cursor: pointer;
}
.cart-info tbody .price, .cart-info tbody .total {
	text-align: right;
}
.cart-info tbody span.stock {
	color: #F00;
	font-weight: bold;
}
.cart-module > div {
	display: none;
}
.cart-total {
	border: 1px solid #2D2D2D;
box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.298);
	overflow: auto;
	padding-top: 8px;
	margin-bottom: 15px;
	padding: 15px;
}
.cart-total table {
	float: right;
}
.cart-total td {
	padding: 3px;
	text-align: right;
}
/* checkout */
.checkout-heading {
	background: #323232;
	border: 1px solid #DBDEE1;
	padding: 8px;
	font-weight: bold;
	font-size: 13px;
	color: #c3c3c3;
	margin-bottom: 15px;
	border: 1px solid #2d2d2d;
	box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.298);
}
.checkout-heading a {
	float: right;
	margin-top: 1px;
	font-weight: normal;
	text-decoration: none;
}
.checkout-content {
	padding: 0px 0px 15px 0px;
	display: none;
	overflow: auto;
}
.checkout-content .left {
	float: left;
	width: 48%;
}
.checkout-content .right {
	float: right;
	width: 48%;
}
.checkout-content .buttons {
	clear: both;
}
.checkout-product table {
	width: 100%;
	border-collapse: collapse;
	border-top: 1px solid #2d2d2d;
	border-left: 1px solid #2d2d2d;
	border-right: 1px solid #2d2d2d;
	margin-bottom: 20px;
}
.checkout-product td {
	padding: 7px;
}
.checkout-product thead td {
	color: #c3c3c3;
	font-weight: bold;
	background-color: #F7F7F7;
	border-bottom: 1px solid #2d2d2d;
}
.checkout-product thead .name, .checkout-product thead .model {
	text-align: left;
}
.checkout-product thead .quantity, .checkout-product thead .price, .checkout-product thead .total {
	text-align: right;
}
.checkout-product tbody td {
	vertical-align: top;
	border-bottom: 1px solid #2d2d2d;
}
.checkout-product tbody .name, .checkout-product tbody .model {
	text-align: left;
}
.checkout-product tbody .quantity, .checkout-product tbody .price, .checkout-product tbody .total {
	text-align: right;
}
.checkout-product tfoot td {
	text-align: right;
	border-bottom: 1px solid #2d2d2d;
}
.contact-info {
	overflow: auto;
}
.contact-info .left {
	float: left;
	width: 48%;
}
.contact-info .right {
	float: left;
	width: 48%;
}
.sitemap-info {
	overflow: auto;
	margin-bottom: 40px;
}
.sitemap-info .left {
	float: left;
	width: 48%;
}
.sitemap-info .right {
	float: left;
	width: 48%;
}
/* footer */ 
#footer {
	background: #202020;
border: 1px solid #2D2D2D;
box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.298);
clear: both;
min-height: 110px;
overflow: auto;
padding: 20px;
}
#footer h3 {
	color: #cccccc;
	font-size: 14px;
	margin-top: 0px;
	margin-bottom: 8px;
	margin-left: 10px;
}
#footer .column {
	background: #202020;
    float: left;
    margin-left: 17px;
    min-height: 110px;
    padding: 12px 0px 0px 15px;
	border: 1px solid #2d2d2d;
	box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.298);
    width: 21%;
}
#footer .column ul {
	margin-top: 0px;
	margin-left: 8px;
	padding-left: 12px;
}
#footer .column ul li {
	margin-bottom: 3px;
}
#footer .column a {
	text-decoration: none;
	color: #cccccc;
}
#footer .column a:hover {
	color: #ff0000;
	text-decoration: none;
}
#powered {
	background: #202020;
border: 1px solid #2D2D2D;
box-shadow: inset 0px 0px 6px rgba(0, 0, 0, 0.298);
clear: both;
font-size: 8px;
margin-bottom: 20px;
margin-top: 5px;
padding: 4px;
text-align: center;
}
/* banner */
.banner div {
	text-align: center;
	width: 100%;
	display: none;
}
.banner div img {
	margin-bottom: 20px;
}
  • +1 1
Надіслати
Поділитися на інших сайтах

deim Veteran

deim

Опубліковано:
Опубліковано:

Не знаю кто вам поставил минус, но знаю за что.

1. Код под спойлер уберите.

2. При наличии ссылки на сайт все и так смогут его сами увидеть.

  • +1 1
Надіслати
Поділитися на інших сайтах
1

Tom Grand Master

Tom

Опубліковано:
Опубліковано:

Лифт пришлось ждать ,что б вниз спуститься! :-D .Могу предложить попробовать другое решение.В    header .tpl  вытащите хидер(<div id="header">) и меню(<div id="menu">) выше контейнера  <div id="container">. Только весь кусок отвечающий за то и другое.

  • +1 1
Надіслати
Поділитися на інших сайтах
1
1

Steel123 Apprentice

Steel123

Опубліковано:
  • Автор
Опубліковано:

Не знаю кто вам поставил минус, но знаю за что.

1. Код под спойлер уберите.

2. При наличии ссылки на сайт все и так смогут его сами увидеть.

Ссори, признаю, в спешке забыл спойлер сделать((

 

Лифт пришлось ждать ,что б вниз спуститься! :-D .Могу предложить попробовать другое решение.В    header .tpl  вытащите хидер(<div id="header">) и меню(<div id="menu">) выше контейнера  <div id="container">. Только весь кусок отвечающий за то и другое.

Спасибо, все получилось, вот теперь с container разобраться бы, а то так и прячется под шапку((

Надіслати
Поділитися на інших сайтах

Tom Grand Master

Tom

Опубліковано:
Опубліковано:

Вы сделали меню фиксированным.Но как то не до конца.Мне так кажется при прокрутке страницы меню должно подниматься вверх и тормозить в верхней части экрана.Зачем ещё и хидер видить всегда?

Надіслати
Поділитися на інших сайтах
1
1

Steel123 Apprentice

Steel123

Опубліковано:
  • Автор
Опубліковано:

Вы сделали меню фиксированным.Но как то не до конца.Мне так кажется при прокрутке страницы меню должно подниматься вверх и тормозить в верхней части экрана.Зачем ещё и хидер видить всегда?

Пожелание человека для которого сайт делаю. Думаю до него чуть позже дойдет)
Надіслати
Поділитися на інших сайтах

Steel123 Apprentice

Steel123

Опубліковано:
  • Автор
Опубліковано:

Еще добавьте стили для #container 


#container{
 ....
.....
.....
margin-top: 203px;
}
А для #header

#header{
.....
.....
.....
.....
top: 0px;
}
Спасибо большое) Все что доктор прописал)
Надіслати
Поділитися на інших сайтах

Створіть аккаунт або увійдіть для коментування

Ви повинні бути користувачем, щоб залишити коментар

Створити обліковий запис

Зареєструйтеся для отримання облікового запису. Це просто!

Зареєструвати аккаунт

Вхід

Уже зареєстровані? Увійдіть тут.

Вхід зараз
 Share
Перейти до списку тем

  • Зараз на сторінці   0 користувачів

    • Ні користувачів, які переглядиють цю сторінку

Покупцям

Розробникам

Корисна інформація

Останні розширення

×
×
  • Створити...

Important Information

На нашому сайті використовуються файли cookie і відбувається обробка деяких персональних даних користувачів, щоб поліпшити користувальницький інтерфейс. Щоб дізнатися для чого і які персональні дані ми обробляємо перейдіть за посиланням . Якщо Ви натиснете «Я даю згоду», це означає, що Ви розумієте і приймаєте всі умови, зазначені в цьому Повідомленні про конфіденційність.

  Я даю згоду