Dynamsiches horizontales Menü

  • Themenstarter Themenstarter Fullku
  • Beginndatum Beginndatum
Status
Nicht offen für weitere Antworten.
F

Fullku

Liebe Helfer,
ich verzweifle gerade an diesem CSS Stück. Abgestuft habe ich es noch hinbekommen, aber wenn ich es jetzt horizontal machen will verzweifle ich. Inlist funktioniert nicht, margin neu definiert auch nicht.

Also bitte sagt mir wie und befreit mich von dieser blamablen Situation... die dynamischen links sollen horizontal dargestellt werden mit knapp 1,5 cm abstand... danke für eure hilfe
fullku

PHP:
/*
Theme Name: Sendusty
Author: Julien Philipp Pl?micke
*/
 
/* Links */
#content a:link { text-decoration: none; color: #990000; }
#content  a:visited { text-decoration: none; color: #990000; }
#content  a:hover, a:active { text-decoration: none; color: #cccccc; }
/* Headings */
#content h1, h3, h4, h5, h6 { font-weight: bold; color: #990000; }
#content h3,font-size: 14px; }
#content h2 { font-size: 14px; font-weight: bold; margin: 10px; color: #990000; }
 
/* Structure */
body
{
 margin: 0;
 padding: 0;
 background-image: url(images/bg.gif);
 background-repeat: repeat-x;
 background-color: #FFFFFF;
 font-family:Verdana, Arial, Helvetica, sans-serif;
 font-size:11px;
}
#wrapper2 {
width: 800px;
margin-left: auto;
margin-right: auto;
background-color: #990000;
text-decoration: none;
}
#header
{
 width: 800px;
 height: 100px;
 background: #FFFFFF;
 float: left;
 text-decoration: none;
}
#wrapper
{
 clear: both;
 float: left;
 width: 800px;
 text-decoration: none;
}
#content-wrapper
{
 width: 800px;
 float: left;
}
#content
{
 float: left;
 width: 760px;
 margin-top: 0;
 padding: 0px 20px 20px 20px;
 background: #e8e8e8; 
}
#content img {
 float: left;
 margin-left: -20px;
 margin-bottom:20px;
}
#footer
{
 font-family:Verdana, Arial, Helvetica, sans-serif;
 clear: both;
 float: left;
 width: 780px;
 height: 40px;
 border-top-color:#cccccc;
 border-top-style:solid;
 border-top-width: 10px;
 text-align: left;
 padding-left: 20px;
 padding-top: 10px;
 background: #990000;
 color: #cccccc;
 font-size: 9px;
}
#footer a {
 color: #FFFFFF;
 font-size: 10px;
 text-decoration:none;
 }
#footer a: visited {
 color: #FFFFFF;
 }
#footer a:hover {
 color: #cccccc;
 }
 
#extras
{
 float: left;
 width: 780px;
 color: #444444;
 text-align: left;
 padding: 0 10px 10px;
 margin: 10px 12px 20px;
 background-color: #f5f5f5;
 border-top: 1px solid #e0e0e0;
 border-bottom: 1px solid #e0e0e0;
}
 
 
/* Navigation */
 
#navigation { float: left; background-color: #990000; width:800px; height:50px; display:block; text-decoration: none; }
#navigation ul { margin-left:100px; list-style-type:none; list-style-position:inherit; text-decoration: none; background-color: #990000;  padding: 0 0px 0 0;}
#navigation li { background-color: #990000; text-decoration: none; }
#navigation li a:link,
#navigation li a:visited
{
 float: left;
 background-color: #990000;
 color: #ffffff; 
 padding: 5px 25px 5px;
 margin-right: 1px;
 border: none;
 height: 13px;
 font-size: 14px;
 margin-top: 4px;
 text-decoration: none;
}
.page_item
{ background-color: #990000 ;
  text-decoration: none;
}
 
#navigation li a:hover,
#navigation li a:active
{
 color: #FFFFFF;
 background-color: #990000;
 font-size: 14px;
 margin-top: 4px;
 text-decoration: none;
}
#navigation li.active a
{
 color: #FFFFFF;
 background-color: #990000;
 text-decoration: none;
}
/* Wrapper */
#wrapper a:link { font-weight: bold; text-decoration: none; }
#wrapper a:visited { font-weight: bold; text-decoration: none;}
#wrapper a:hover, #wrapper a:active {text-decoration: none; }
/* Content */
#content .post-title a { border-bottom-width: 0; }
#content .post p.img { float: left; margin: 0 0px 0 0; }
#content .post p.img img { padding: 0px; border: 1px solid #d0d0d0; background-color: #eeeeee; }
#content .post-footer 
{ 
 font-size: 90%; 
 color: #888888;
 margin-bottom: 5px; 
 padding:0px 5px 5px 0px;
 background-repeat: none;
 background-color: #FFF9F0;
 border: 1px solid #FFEACC;
}
 
Hi,

das Menü wird doch mittels der float:left-Deklaration für die Links horizontal ausgerichtet.

Lediglich der IE6 zeigt die Links treppenartig versetzt an.

Lösung:

Code:
#navigation li { background-color: #990000; text-decoration: none; display:inline; }
mfg Maik
 
Status
Nicht offen für weitere Antworten.
Zurück