CSS Problem mit Anpassung von Flowered
Posted: Thu Aug 09, 2007 6:54 pm
Hallihallo,
ich bin gerade dabei das Theme Flowered anzupassen.
Leider bin ich nicht sooo der CSS Freak und hab daher gerade zwei kleine Problemchen:
URL http://www.mikra-design.de/cms/
1.) würde ich gerne haben das der Menubalken bis links durchgeht.
2.) stört mich der Zwischenraum zwischen Menubalken und weißem Content bereich.
Die CSS:
Jemand zufällig ne Idee?
Besten Dank im Voraus!
Ole
ich bin gerade dabei das Theme Flowered anzupassen.
Leider bin ich nicht sooo der CSS Freak und hab daher gerade zwei kleine Problemchen:
URL http://www.mikra-design.de/cms/
1.) würde ich gerne haben das der Menubalken bis links durchgeht.
2.) stört mich der Zwischenraum zwischen Menubalken und weißem Content bereich.
Die CSS:
Code: Select all
body {
margin: 0;
font-family: verdana, arial, helvetica, sans-serif;
background-image: url(uploads/images/templates/flowered/bg2.jpg);
background-repeat: repeat-y repeat-x;
color: #000000;
}
#container {
width: 800px;
display: inline;
}
#main-title {
margin-bottom: 0;
margin-left: 110px;
margin-right: 110px;
font-size: .7em;
letter-spacing: 5px;
text-align: right;
margin-top: 0;
padding-bottom: 8px;
font-weight: bold;
padding-top: 8px;
padding-right: 50px;
background-color: #333333;
color: #ffffff;
border-top: 1px #000000 solid;
border-bottom: 1px #000000 solid;
}
#header-image {
background-color: #5b5b5b;
background-image: url(uploads/images/templates/flowered/mk_header.jpg);
background-repeat: no-repeat;
background-position: center top;
height: 200px;
border-top: 2px #49abd9 solid;
border-bottom: 2px #49abd9 solid;
margin-left: 110px;
margin-right: 110px;
}
#navbar {
margin-bottom: 0;
margin-left: 110px;
margin-right: 110px;
font-size: .65em;
text-align: center;
margin-top: 0;
padding-bottom: 8px;
font-weight: bold;
padding-top: 8px;
background-color: #333333;
color: #ffffff;
word-spacing: 8px;
border-bottom: 2px #ff4700 solid;
}
#navbar a:link, #navbar a:visited {
color: #ffffff;
word-spacing: none;
}
#navbar a.current {
color: #ff4700;
}
#navbar a:hover {
color: #ff4700;
text-decoration: underline;
}
#headline {
font-size: .65em;
padding-top: 30px;
text-align: justify;
background-color: #F2F2F2;
padding-left: 100px;
padding-right: 100px;
margin-left: 110px;
margin-right: 110px;
margin-bottom: 0;
line-height: 1.5em;}
p.byline {
text-align: right;
margin-bottom: 0;
}
h1 {
margin-left: 110px;
margin-right: 110px;
font-size: .8em;
padding-bottom: 3px;
padding-top: 23px;
padding-left: 50px;
padding-right: 0;
color: #000000;
border-bottom: 1px #ff4700 solid;
letter-spacing: 5px;
font-weight: bold;
background-color: #F2F2F2;
margin-top: 0;
margin-bottom: 0;
}
#main-text {
margin-top: 0;
margin-bottom: 0;
margin-left: 110px;
margin-right: 110px;
font-size: .7em;
line-height: 1.8em;
background-color: #ffffff;
border-botom: 1px #49abd9 solid;
}
#main-text p {
text-align: justify;
margin-left: 50px;
margin-right: 50px;
}
h2 {
padding-bottom: 3px;
padding-right: 0;
color: #000000;
border-bottom: 1px #000000 solid;
letter-spacing: 5px;
margin-left: 50px;
margin-right: 50px;
font-size: 1em;
margin-top: 0;
padding-top: 10px;
}
p, ul, ol, table {
margin-top: 17px;
margin-bottom: 0;
}
ol, ul {
margin-left: 75px;
margin-right: 75px;
}
a:link, a:visited {
text-decoration: none;
font-weight: bold;
color: #ff0000;
}
a:hover {
text-decoration: underline;
}
#footer {
text-align: center;
margin-bottom: 0;
padding-top: 8px;
padding-bottom: 8px;
font-size: 11px;
margin-top: 20px;
padding-right: 50px;
background-color: #333333;
color: #5b5b5b;
font-weight: bold;
border-top: 1px #49abd9 solid;
border-bottom: 1px #49abd9 solid;
}
#footer a:link, #footer a:visited {
color: #5b5b5b;
text-decoration: none;
}
#footer a:hover {
text-decoration: underline;
color: #ffffff;
}
.right {
float: right;
text-align: right;
width: 50%;
}
.left {
float: left;
text-align: left;
padding-left: 50px;
}
.right h3 {
margin-top: 0px;
font-size: 90%;
}
.stretch,
.clear {
clear:both;
height:1px;
margin:0;
padding:0;
font-size: .7em;
line-height: 1px;
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
* html>body .clearfix {
display: inline-block;
width: 100%;
}
* html .clearfix {
/* Hides from IE-mac \*/
height: 1%;
/* End hide from IE-mac */
}
/* end clearing */
/* replace */
.replace {
display:block;
background-repeat: no-repeat;
background-position: left top;
background-color:transparent;
}
/* tidy these up */
.replace * {
text-indent: -10000px;
display:block;
background-repeat: no-repeat;
background-position: left top;
background-color:transparent;
}
.replace a {
text-indent:0;
}
.replace a span {
text-indent:-10000px;
}
/* end replace */
/* accessibility */
span.accesskey {
text-decoration:none;
}
.accessibility {
position: absolute;
top: -999em;
left: -999em;
}
dfn {
position: absolute;
left: -1000px;
top: -1000px;
width: 0;
height: 0;
overflow: hidden;
display: inline;
}
div.left49 {
float: left;
width: 49%;
}
div.right49 {
float: right;
width: 49%;
text-align: right;
}/* Horizontal menu for the CMS CSS Menu Module */
/* by Alexander Endresen */
/* The wrapper clears the floating elements of the menu */
#menuwrapper {
overflow: hidden;
background-color: #5b5b5b;
border-bottom: 1px solid #49abd9;
width: 800px;
font-size: .65em;
color: white;
margin-left: 110px;
}
/* Set the width of the menu elements at second level. Leaving first level flexible. */
#primary-nav li li {
width: 200px;
}
/* Unless you know what you do, do not touch this */
#primary-nav, #primary-nav ul {
list-style: none;
margin: 0px;
padding: 0px;
}
#primary-nav ul {
position: absolute;
top: auto;
display: none;
}
#primary-nav ul ul {
margin-top: 1px;
margin-left: -1px;
left: 100%;
top: 0px;
}
#primary-nav li {
margin-left: -1px;
float: left;
}
#primary-nav li li {
margin-left: 0px;
margin-top: -1px;
float: none;
position: relative;
}
/* Styling the basic apperance of the menu elements */
#primary-nav a {
display: block;
margin: 0px;
padding: 5px 10px;
text-decoration: none;
color : white;
}
#primary-nav li a {
border-right: 1px solid #49abd9;
border-left: 1px solid #49abd9;
color : white;
}
#primary-nav li li a {
border: 1px solid #49abd9;
}
#primary-nav li, #primary-nav li.menuparent {
background-color: #333333;
color : white;
}
/* Styling the basic apperance of the active page elements (shows what page in the menu is being displayed) */
#primary-nav li.menuactive {
background-color: #5b5b5b;
color: red;
}
/* Styling the basic apperance of the menuparents - here styled the same on hover (fixes IE bug) */
#primary-nav ul li.menuparent, #primary-nav ul li.menuparent:hover, #primary-nav ul li.menuparenth {
background-image: url(modules/MenuManager/images/arrow.gif);
background-position: center right;
background-repeat: no-repeat;
color: red;
}
/* Styling the apperance of menu items on hover */
#primary-nav li:hover, #primary-nav li.menuh, #primary-nav li.menuparenth, #primary-nav li.menuactiveh {
background-color: #333333;
color : red;
}
/* The magic - set to work for up to a 3 level menu, but can be increased unlimited */
#primary-nav ul, #primary-nav li:hover ul, #primary-nav li:hover ul ul,
#primary-nav li.menuparenth ul, #primary-nav li.menuparenth ul ul {
display: none;
color: red;
}
#primary-nav li:hover ul, #primary-nav ul li:hover ul, #primary-nav ul ul li:hover ul,
#primary-nav li.menuparenth ul, #primary-nav ul li.menuparenth ul, #primary-nav ul ul li.menuparenth ul {
display: block;
}
/* IE Hacks */
#primary-nav li li {
float: left;
clear: both;
}
#primary-nav li li a {
height: 1%;
}
Jemand zufällig ne Idee?
Besten Dank im Voraus!
Ole