|
|||
horizontale liste - zeilenumbruch geht nicht
hallo! ich habe eine horizontale liste mit display:inline erstellt aber leider kann ich die liste nicht in einer festen breite halten, weil es einfach keinen zeilenumbruch gibt. ich hab den div container in welcher die liste liegt schon eine feste breite zugewiesen aber funzt trotzdem nicht.
ul#mainlevel_u1 li { display:inline; list-style-type:none; text-decoration:underline; padding-left:10px;} weiß jemand woran das evtl. liegt? |
Sponsored Links |
|
|||
Bitte lies und beachte die Hinweise für Fragende. So kann dir niemand helfen.
__________________
Corina Rudel Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken |
Sponsored Links |
|
|||
im div headerright liegt das entsprechende modul als horizontale liste.
</div><div id="headerright"><jdoc:include type="modules" name="user5" style="xhtml" /> hier das css div#headerright { width:600px; height:78px; margin-left:200px; margin-top:0px; padding:0px; } ul.menu_main li { margin-left:0px; padding-top:5px; list-style: none;} ich habe viele links und leider gibt es keinen zeilenumbruch... das ist aber notwendig |
|
|||
Wenn es keinen Zeilenumbruch gibt, hast du entweder irgendwo die white-space-Eigenschaft verwendet oder es gibt keinen Whitespace. Das kann man an deinen Codeschnipseln nicht sehen!1elf!
Ich kapier das einfach nicht. Was genau hast du an den Hinweisen für Fragende nicht verstanden? Wo ist der Link zum Problem?
__________________
Corina Rudel Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken |
|
|||
Zitat:
<body id="body"> <div id="wrapper" class="clearfix"> <div id="header"><div id="header1"><jdoc:include type="modules" name="user2" style="xhtml" /></div> <div id="header2"><div id="headerleft"><jdoc:include type="modules" name="user4" style="xhtml" /></div><div id="headerright"><jdoc:include type="modules" name="user5" style="xhtml" /></div></div><div id="header3"></div></div> <div id="leftCol"><jdoc:include type="modules" name="left" style="xhtml" /></div> <div id="centerCol"><jdoc:include type="component" style="xhtml" /></div> <div id="footer" class="clear"></div> </div> </body> __________________ #body {width:auto; height:auto; text-align:center; margin-top:0px;} div { text-align: left; /* text-align:center wieder aufheben, damit DIV-Inhalte linksbündig ausgerichtet sind */ } div#wrapper {width:850px; height:auto; margin:0px; margin-top:0px; background: url(../images/3cols.png) repeat-y; margin-left:auto; margin-right:auto; font-family:Arial; font-size:12px;} div#header { width: auto; height:auto; margin-top:0px; } div#header1 { width: auto; height:60px; margin-top:0px; background-color: gray; background: url(../images/menubg.png) repeat-x; } div#header2 { width: auto; height:78px; margin-top:0px; background-color: white; } div#headerleft { float: left; width: 200px; height:78px; margin-top:0px; } div#headerright { width:auto; height:78px; margin-left:200px; margin-top:0px; padding:0px; } div#header3 { width: auto; height:152px; background-color: white; background: url(../images/header3bg.png) no-repeat; } div#leftCol { float: left; width: 200px; } div#centerCol { padding:15px;width:auto; margin-left:200px; } div#footer { width:100%;height:60px; background: #202528; margin-bottom:-15px; } div.moduletable {margin-top:0px; } div.moduletable_s1 {padding:15px; margin-top:0px; background: #e5eaed; } div.moduletable_s2 {padding:20px; margin-top:15px; background: #d3cd99; } div.moduletable_s2 h3 {color: white;} } div.moduletable_s3 {padding:20px; margin-top:15px; background: #d4cb8d; } div.moduletable_s4 {margin-top:0px; height:78px; } div.moduletable-nav {margin-top:0px; padding-top:0px; } div.moduletable-oben {margin-top:0px;width:600px; padding-top:15px; } div#jflanguageselection {margin-right:140px; } .buttonheading img { border-style:none; } .contentheading { font-size:14px; font-weight: bold; color:#3a382b; } fieldset.input { border-style:none; } ul { margin-left: 0px; padding-left: 0px; margin-top:0px; } ul#mainlevel-nav { margin:0px; padding-top:20px;} ul#mainlevel_u1 li , ul#mainlevel_u2 li { display:inline; list-style-type:none; text-decoration:underline; padding-left:10px;} ul#mainlevel_u2 li { font-weight:bold; } a.mainlevel { font-family:Arial; font-size:12px; margin-left:0px; color:#202528; padding-right:15px; text-decoration:underline;} ul.menu_main li { margin-left:0px; padding-top:5px; list-style: none;} ul.menu_main a { font-family:Arial; font-size:12px; margin-left:0px; color:#3a382b;padding-top:5px; text-decoration:underline;} ul.menu-nav { display:inline; list-style-type:none; text-decoration:underline;} a.mainlevel_u2 { font-family:Arial; font-size:12px; font-weight:bold; margin-left:0px; color:white; padding-left:15px;} a.readon { font-family:Arial; font-size:12px; font-weight:bold; margin-left:0px; color:#3a382b;} /* clearfix zum Aufheben der Floatumgebung */ .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix {display: inline-block;} /* Hides from IE-mac \*/ * html .clearfix {height: 1%;} .clearfix {display: block;} /* End hide from IE-mac */ .clear {clear:both;} |
|
|||
Zitat:
Erstell ein vollständiges HTML-Dokument (das beginnt mit dem Doctype) und binde dein Stylesheet im Head ein. Nutze die Codetags, dann ist es nicht unübersichtlich. Dann kann jemand mit genug Lust und Zeit deinen Code rauskopieren und lokal testen. Solange du jedoch die relevanten Teile deines Code nicht herzeigst, ist es unmöglich dir zu helfen. Was sollen wir denn deiner Ansicht nach mit <jdoc:include type="modules" name="user4" style="xhtml" /> anfangen?
__________________
Corina Rudel Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken |
|
|||
<?php
defined( '_JEXEC' ) or die( 'Restricted access' ); ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <jdoc:include type="head" /> <!--[if IE 6]> <script type="text/javascript" src="templates/<?php echo $this->template ?>/scripts/ie_png.js"></script> <script type="text/javascript"> ie_png.fix('.png'); </script> <![endif]--> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link href="templates/<?php echo $this->template ?>/css/template.css" rel="stylesheet" type="text/css" /> </head> <body id="body"> <div id="wrapper" class="clearfix"> <div id="header"><div id="header1"><jdoc:include type="modules" name="user2" style="xhtml" /></div> <div id="header2"><div id="headerleft"><jdoc:include type="modules" name="user4" style="xhtml" /></div><div id="headerright"><jdoc:include type="modules" name="user5" style="xhtml" /></div></div><div id="header3"></div></div> <div id="leftCol"><jdoc:include type="modules" name="left" style="xhtml" /></div> <div id="centerCol"><jdoc:include type="component" style="xhtml" /></div> <div id="footer" class="clear"></div> </div> </body> </html> #body {width:auto; height:auto; text-align:center; margin-top:0px;} div { text-align: left; /* text-align:center wieder aufheben, damit DIV-Inhalte linksbündig ausgerichtet sind */ } div#wrapper {width:850px; height:auto; margin:0px; margin-top:0px; background: url(../images/3cols.png) repeat-y; margin-left:auto; margin-right:auto; font-family:Arial; font-size:12px;} div#header { width: auto; height:auto; margin-top:0px; } div#header1 { width: auto; height:60px; margin-top:0px; background-color: gray; background: url(../images/menubg.png) repeat-x; } div#header2 { width: auto; height:78px; margin-top:0px; background-color: white; } div#headerleft { float: left; width: 200px; height:78px; margin-top:0px; } div#headerright { width:auto; height:78px; margin-left:200px; margin-top:0px; padding:0px; } div#header3 { width: auto; height:152px; background-color: white; background: url(../images/header3bg.png) no-repeat; } div#leftCol { float: left; width: 200px; } div#centerCol { padding:15px;width:auto; margin-left:200px; } div#footer { width:100%;height:60px; background: #202528; margin-bottom:-15px; } div.moduletable {margin-top:0px; } div.moduletable_s1 {padding:15px; margin-top:0px; background: #e5eaed; } div.moduletable_s2 {padding:20px; margin-top:15px; background: #d3cd99; } div.moduletable_s2 h3 {color: white;} } div.moduletable_s3 {padding:20px; margin-top:15px; background: #d4cb8d; } div.moduletable_s4 {margin-top:0px; height:78px; } div.moduletable-nav {margin-top:0px; padding-top:0px; } div.moduletable-oben {margin-top:0px;width:600px; padding-top:15px; } div.moduletable_u2 {margin-top:0px; padding-top:20px; } div#jflanguageselection {margin-right:140px; } .buttonheading img { border-style:none; } .contentheading { font-size:14px; font-weight: bold; color:#3a382b; } fieldset.input { border-style:none; } ul { margin-left: 0px; padding-left: 0px; margin-top:0px; } ul#mainlevel-nav { margin:0px; padding-top:20px;} ul#mainlevel_u1 li , ul#mainlevel_u2 li { display:inline; list-style-type:none; text-decoration:underline; padding-left:10px;} ul#mainlevel_u2 li { font-weight:bold; text-decoration:none} a.mainlevel { font-family:Arial; font-size:12px; margin-left:0px; color:#202528; padding-right:15px; text-decoration:underline;} ul.menu_main li { margin-left:0px; padding-top:5px; list-style: none;} ul.menu_main a { font-family:Arial; font-size:12px; margin-left:0px; color:#3a382b;padding-top:5px; text-decoration:underline;} ul.menu-nav { display:inline; list-style-type:none; text-decoration:underline;} a.mainlevel_u2 { font-family:Arial; font-size:12px; font-weight:bold; margin-left:0px; color:white; padding-left:15px;} a.readon { font-family:Arial; font-size:12px; font-weight:bold; margin-left:0px; color:#3a382b;} /* clearfix zum Aufheben der Floatumgebung */ .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix {display: inline-block;} /* Hides from IE-mac \*/ * html .clearfix {height: 1%;} .clearfix {display: block;} /* End hide from IE-mac */ .clear {clear:both;} |
|
|||
Ich gebe auf.
Vielleicht findet sich ja jemand, den du verstehst.
__________________
Corina Rudel Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken |
|
|||
HI!
Stell doch nicht den Quelltext ein, der in der index.php steht, sondern den Quelltext, der erzeugt wird in Joomla - so kann Dir wirklich keiner weiterhelfen... und unfreundlich war hier nun wirklich niemand! cu Volker |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Horizontale Liste mit Dropdown zentrieren | Amnesys | (X)HTML | 4 | 13.10.2010 09:53 |
Horizontale Liste mit breiteren Unterpunkten | Korasu | CSS | 3 | 12.05.2009 10:00 |
Horizontale Liste geschachtelt, kein Flyout | letslounge | CSS | 5 | 14.08.2008 00:27 |
Horizontale Liste: "list-style-type:none" nötig? | Steakfred | CSS | 1 | 03.11.2007 18:47 |
Problem mit Horizontaler Liste bei Zeilenumbruch | captain | CSS | 5 | 26.11.2004 12:05 |