Hallo,
ich hoffe mir kann einer weiterhelfen.
Ich möchte gerne in den Header und Foote eine Hintergrundgrafik einfügen, die sich jeweils auch an die abgerundeten Ecken hält.
Jeder meiner Versuche schlug fehl in der Suche habe ich leider nichts verwertbares für mich gefunden.
Hier ein Auszug aus meiner Custom.css
ich hoffe mir kann einer weiterhelfen.
Ich möchte gerne in den Header und Foote eine Hintergrundgrafik einfügen, die sich jeweils auch an die abgerundeten Ecken hält.
Jeder meiner Versuche schlug fehl in der Suche habe ich leider nichts verwertbares für mich gefunden.
Hier ein Auszug aus meiner Custom.css
Code:
/* aussenabstaende */
#outer_wrapper, #header { padding-top: 15px; padding-left: 15px; padding-right: 15px; background: #fff; /*border-left: 15px solid #fff; border-right: 15px solid #fff;*/ }
#outer_wrapper { overflow:hidden; }
#footer { padding: 15px; }
#speciallinks { padding: 0 15px; border-radius: inherit;}
#settings { right: 15px; top: 0; }
/* 960px Shop-Breite, damit Darstellung bei 1024 okay ist */
.page_width { width: 1080px; }
body, #page, #footer_wrapper { background: #31313A none; }
#outer_wrapper { margin-top: 0; }
#header { padding-top: 12px; }
.panel_left #content { padding-left: 20px; }
.panel_right #content { padding-right: 20px; }
#logo { z-index: 200; top: 10px; }
/*Textbereich Schatten */
#outer_wrapper {
-moz-box-shadow: 5px 5px 5px #888;
-webkit-box-shadow: 0px 0px 0px #888;
box-shadow: 0px 0px 10px #ccc;
border-radius: 0px;
border-top-right-radius: 0px;
border-top-left-radius: 0px;
}
/* basic colors */
#headlinks_wrapper, #page_wrapper { background: #fff none; }
html, body { color: #4a4a4a; }
a, a:visited, a:link { color: #b53a6b; }
#configset ul.semtabs li.active a { background-color: #694b61; color: #fff; }
/* Header */
#header { height: 240px; }
#headlinks_wrapper { margin: 0px; }
#headlinks_wrapper {
margin: 0px;
z-index: inherit;
}
/* Abstand Bildschirm oben und unten */
/* ------ ABSTAND START ------ */
#header_wrapper {
padding-top: 15px;
}
#footer_wrapper {
padding-bottom: 15px;
}
/* ------ Abstand ENDE ------ */
/*Rundungen vom Header */
/* ------ Header_Rundung START ------ */
#header {
border-radius: 15px 15px 0px 0px;
-moz-border-radius: 15px 15px 0px 0px;
-webkit-border-radius:15px 15px 0px 0px;
-khtml-border-radius: 15px 15px 0px 0px;
background-color: #ffffff;
font-size: 0.9em;
color: #666;
line-height: 20px;
width: 1080px;
/* Schatten um Header */
-moz-box-shadow: 5px 5px 5px #888;
-webkit-box-shadow: 0px 0px 0px #888;
box-shadow: 0px 0px 10px #ccc;
}
/* ------ Header_Rundung ENDE ------ */
#footer {
background-color: #FFFFFF;
-moz-box-shadow: 5px 5px 5px #888;
-webkit-box-shadow: 0px 0px 0px #888;
box-shadow: 0px 0px 10px #ccc;
}
/* ------ Copyright_FOOTER START ------ */
#footer .master {
border-radius: 0 0 0px 0px;
-moz-border-radius: 0 0 0px 0px;
-webkit-border-radius: 0 0 0px 0px;
-khtml-border-radius: 0 0 0px 0px;
background-color: #f5f5f5;
font-size: 0.9em;
color: #666;
line-height: 20px;
}
/* ------ Copyright_FOOTER ENDE ------ */
/*Headlinks = Facebook Balken inkl. Suche */
/* ------ Headlinks START ------ */
#headlinks {
min-height: 40px;
background-color: #fafafa;
background-image: -moz-linear-gradient(top, #ffffff, #f2f2f2);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f2f2f2) );
background-image: -webkit-linear-gradient(top, #ffffff, #f2f2f2);
background-image: -o-linear-gradient(top, #ffffff, #f2f2f2);
background-image: linear-gradient(to bottom, #ffffff, #f2f2f2);
background-repeat: repeat-x;
border: 1px solid #d4d4d4;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0 );
*zoom: 1;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.065);
-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.065);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.065);
z-index: inherit;
}
#headlinks>ul>li>a {
color: #555;
font-size: 1.1em;
text-shadow: 0 1px 0 white;
display: block;
border-radius: 0;
-moz-border-radius: 0;
-webkit-border-radius: 0;
-khtml-border-radius: 0;
background-color: transparent;
}
#headlinks::before,#headlinks::after {
display: table;
line-height: 0;
content: "";
clear: both;
}
#headlinks li {
padding: 0;
}
#headlinks>ul>li>a,#headlinks>ul>li>a:hover {
line-height: 20px;
margin-top: 0;
padding: 10px 15px 10px;
line-height: 20px;
height: auto;
}
#headlinks>ul>li>a:hover {
color: #333;
}
#headlinks>ul>li>a:hover,#headlinks>ul>li.current>a {
background-color: transparent;
}
#headlinks>ul>li.current>a {
-webkit-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
-moz-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
}