Index: typo3/sysext/t3skin/stylesheets/typo3-dyntabmenu.css =================================================================== --- typo3/sysext/t3skin/stylesheets/typo3-dyntabmenu.css (revision 4962) +++ typo3/sysext/t3skin/stylesheets/typo3-dyntabmenu.css (working copy) @@ -18,59 +18,72 @@ } table#typo3-tabmenu td.tab, -table.typo3-dyntabmenu td { +hr.typo3-dyntabmenu-clear { + clear: left; + border: none; +} + +ul.typo3-dyntabmenu { + padding: 0; + margin: 0; +} + +ul.typo3-dyntabmenu li { color: #E6E1B2; border: solid 1px #A2AAB8; border-bottom: 0; padding: 0; cursor: pointer; + float: left; + list-style: none; + height: auto; } -table#typo3-tabmenu td.tab, -table.typo3-dyntabmenu td.tab { +ul#typo3-tabmenu li.tab, +ul.typo3-dyntabmenu li.tab { background-color: transparent; } -table#typo3-tabmenu td.tabact, -table.typo3-dyntabmenu td.tabact:hover, -table.typo3-dyntabmenu td.tabact a { +ul#typo3-tabmenu li.tabact, +ul.typo3-dyntabmenu li.tabact:hover, +ul.typo3-dyntabmenu li.tabact a { background-color: #F8F9FB; } -table#typo3-tabmenu td.disabled, -table.typo3-dyntabmenu td.disabled, -table.typo3-dyntabmenu td.disabled_over { +ul#typo3-tabmenu li.disabled, +ul.typo3-dyntabmenu li.disabled, +ul.typo3-dyntabmenu li.disabled_over { padding: 5px 10px 5px 10px; color: #A2AAB8; background-color: #EFEFF4; } -table#typo3-tabmenu td a, -table.typo3-dyntabmenu td a { +ul#typo3-tabmenu li a, +ul.typo3-dyntabmenu li a { padding: 5px 10px 5px 10px; display: block; width: auto; } -table#typo3-tabmenu td.tab:hover, -table#typo3-tabmenu td a:hover, -table.typo3-dyntabmenu td:hover, -table.typo3-dyntabmenu td a:hover { +ul#typo3-tabmenu li.tab:hover, +ul#typo3-tabmenu li a:hover, +ul.typo3-dyntabmenu li:hover, +ul.typo3-dyntabmenu li a:hover { background-color: #F8F9FB; } -div.typo3-dyntabmenu-divs-foldout div.disabled, +div.typo3-dyntabmenu-divs-foldout div.disabled, div.typo3-dyntabmenu-divs-foldout div.disabled_over { background: #CCCCCC; } div.typo3-dyntabmenu-divs-foldout div.tab, -div.typo3-dyntabmenu-divs-foldout div.tabact { +div.typo3-dyntabmenu-divs-foldout div.tabact { background: #FEFEFE; - + } div.typo3-dyntabmenu-divs-foldout div.tab_over, -div.typo3-dyntabmenu-divs-foldout div.tabact_over { +div.typo3-dyntabmenu-divs-foldout div.tabact_over { background: #D7DBE2; } Index: typo3/template.php =================================================================== --- typo3/template.php (revision 4962) +++ typo3/template.php (working copy) @@ -1466,7 +1466,8 @@ $divs = array(); $JSinit = array(); $id = $this->getDynTabMenuId($identString); - $noWrap = $noWrap ? ' nowrap="nowrap"' : ''; + //$noWrap = $noWrap ? ' nowrap="nowrap"' : ''; + $noWrap = ''; // Traverse menu items $c=0; @@ -1476,7 +1477,7 @@ $index+=1; // Need to add one so checking for first index in JavaScript is different than if it is not set at all. // Switch to next tab row if needed - if (!$foldout && ($titleLenCount>$newRowCharLimit | ($def['newline'] === true && $titleLenCount > 0))) { + if (!$foldout && ($titleLenCount>$newRowCharLimit | $titleLenCount > 0)) { $titleLenCount=0; $tabRows++; $options[$tabRows] = array(); @@ -1501,14 +1502,14 @@ if (!$foldout) { // Create TAB cell: $options[$tabRows][] = ' - '. +
  • '. ($isEmpty ? '' : ''). $def['icon']. ($def['label'] ? htmlspecialchars($def['label']) : ' '). $requiredIcon. $this->icons($def['stateIcon'],'margin-left: 10px;'). ($isEmpty ? '' : ''). - ''; + '
  • '; $titleLenCount+= strlen($def['label']); } else { // Create DIV layer for content: @@ -1552,13 +1553,11 @@ $tabContent.= ' - - + '.implode('',$options[$a]).' - -
    '; + '; } - $content.= '
    '.$tabContent.'
    '; + $content.= '
    '.$tabContent.'
    '; } // Div layers are added: Index: typo3/stylesheet.css =================================================================== --- typo3/stylesheet.css (revision 4962) +++ typo3/stylesheet.css (working copy) @@ -467,11 +467,23 @@ background: #e7dba8; } -table.typo3-dyntabmenu tr { +hr.typo3-dyntabmenu-clear { + clear: left; + border: none; +} + +ul.typo3-dyntabmenu li { height: 1.5em; + float: left; + list-style: none; } -table.typo3-dyntabmenu td { +ul.typo3-dyntabmenu { + padding: 0; + margin: 0; +} + +ul.typo3-dyntabmenu li { padding-left: 5px; padding-right: 5px; border-radius: 3px; @@ -487,32 +499,32 @@ -webkit-border-top-right-radius: 3px; } -table.typo3-dyntabmenu td.tab { +ul.typo3-dyntabmenu li.tab { background: #c4d4cd; } -table.typo3-dyntabmenu td.tabact { +ul.typo3-dyntabmenu li.tabact { background: #e7dba8; } -table.typo3-dyntabmenu td.tabact, -table.typo3-dyntabmenu td.tabact_over { +ul.typo3-dyntabmenu li.tabact, +ul.typo3-dyntabmenu li.tabact_over { border-color: black; } -table.typo3-dyntabmenu td.tab_over, -table.typo3-dyntabmenu td.tabact_over { +ul.typo3-dyntabmenu li.tab_over, +ul.typo3-dyntabmenu li.tabact_over { background: #f6eab7; } -table.typo3-dyntabmenu td.disabled, -table.typo3-dyntabmenu td.disabled_over { +ul.typo3-dyntabmenu li.disabled, +ul.typo3-dyntabmenu li.disabled_over { color: #999; background: #ccc; cursor: default; } -table.typo3-dyntabmenu td a { +ul.typo3-dyntabmenu li a { color: #666; text-decoration: none; display: block; @@ -521,12 +533,12 @@ padding-bottom: 2px; } -table.typo3-dyntabmenu td.tabact a, -table.typo3-dyntabmenu td.tabact_over a { +ul.typo3-dyntabmenu li.tabact a, +ul.typo3-dyntabmenu li.tabact_over a { color: black; } -table.typo3-tabmenu td:hover { +ul.typo3-tabmenu li:hover { background: #f6eab7; }