Flexible and robust template
Now substantially improved and simplified
Multiflex-3 is the third generation Multiflex template. Numerous improvements have been made since Multiflex-2: More modern appearance, more page layouts, new drop down menus with sticky hover zones, solid printer support, expanded browser support, fully scalable upwards and downwards when user resizes the default browser font size, and last but not least, a much better and easier code. But there is more than that. Check the navigation menu to discover all about the new Multiflex-3!
Content Management Systems
Portings already available or in development
Extensive browser support
Tested for all common browsers and systems
Multiflex-3 has been tested live for all major browsers, and functions properly for all currently used browsers. Only exception is the very outdated legacy browser IE5.x on Windows and Mac, which is used by about 1.5% of all websurfers globally.
Template successfully tested for (+ indicates the named browser version plus all higher versions):
Windows 2000 and XP
IE6, IE7, Firefox 2.0+, Mozilla 1.7+, Netscape 7.2+, Opera 9.0+ and Safari 3.0+.
IE7, Firefox 2.0+, and Opera 9.0+.
Mac OSX 10.3
Firefox 2.0+, Mozilla 1.7+, Netscape 7.2+, Opera 9.0+, Camino 1.0+, and Safari 1.3+.
Mac OSX 10.4
Firefox 2.0+, Mozilla 1.7+, Netscape 7.2+, Opera 9.0+, Camino 1.0+, and Safari 2.0+.
Linux (Fedora Core 4)
Firefox 2.0+, Mozilla 1.7+, Opera 9.0+, and Konqueror 3.4+.
Check browser screenshots
January 20, 2008
January 8, 2008
Browser: IE6 / Description: A 1px vertical gap between the drop-down menu main navigation bar and the first entry of the submenu entries was by accident introduced in some of the layouts of version 3.10 (typo mistake). When moving the mouse slowly from the navigation bar to the submenu items, the submenu would disappear as the mouse entered the 1px vertical gap area. The reason was found to be in the "top:1px" command in the CSS statement "nav2 table" for IE6 in the files "layoutNN_setup.css" and "headerNN_setup.css" files. / Correction: Changed to "top:0". To make the submenu to align perfectly at the left margin for IE6, a left-margin 1px correction was additionally introduced by changing "left:0" to "left:-1px" in all layoutNN_setup.css and headerNN_setup.css files.
December 16, 2007
Paragraph text beside an image
Browser: All non-IE browsers / Description: When having a paragraph next to an image in the content section, and when the image height is greater than the paragraph height, the subsequent following paragraph would not begin directly after the first paragraph, but at the bottom end of the image. So if the paragraph was very short, and the image high, a substantial amount of vertical free space would result in between these two paragraphs. The reason was found to be in the "clear:both" command in the CSS statement "p:after" in the files "layoutNN_setup.css". / Correction: Removed (commented out) the "clear:both" command in the "p:after" CSS statement in all "layoutNN_setup.css" files. No changes made in the HTML code, except for version number and date. To implement this update in your existing Multiflex-3 webpage you only need to remove the "clear:both" command in the CSS statement "p:after" in your layoutNN_setup.css file.
September 21, 2007
Version numbering and credits
All Multiflex templates now configured consistently in version numbering and author credits. The version numbering is now in the format X.Y, where X is the design series, and Y the version number. The author credits have been reformulated to "Design by 1234.info", with a link to that website.
May 22, 2007
Browser: IE6 and IE7 / Description: In IE6 and IE7 there was a problem when the main level of the drop-down menu contained a large amount of entries so that a second line was necessary. The line break was not functioning properly. / Correction: Only the "headerNN_setup.css" and "layuotNN_setup.css" files were modified. No changes have been made to the HTML code. In the CSS-class ".header-bottom" the statements "height" and "background" were removed. Also ".header-bottom:after" was included at the end of the CSS file to ensure that the container grows consistently with the content size. In ".nav2" the statement "white-space:nowrap" was included to make the line break function properly for IE6. This made it necessary to include a statement "white-space:normal" in the CSS-classes ".nav2 ul li:hover ul li a" and ".nav2 ul li a:hover ul li a".
Browser: IE6 / Description: In IE6 there was a problem with the layer position when the main line of the drop-down menu is 2 or more lines in size. / Correction: Only the "headerNN_setup.css" and "layotNN_setup.css" files were modified. No changes have been made to the HTML code. In the CSS-class ".nav2 ul li" the statement "position:relative" was removed. Then the statements "position:relative" and "z-index:1000" were added to the CSS-class "nav2 ul li a:hover". Additionally a new class ".nav2 ul li:hover" was introduced.
If you have an existing website with Multiflex-3, you only need to update the CSS files. The HTML files are not affected by the changes in this version.
Same as for Multiflex-3.7.
January 15, 2007
Browser: Opera 9.10 / Description: In Opera 9.0.2 the drop-down meus behaved correctly, but in the latest version Opera 9.10, the drop-down main menu collapsed after hovering the main links. / Correction: In the CSS-class ".nav2 ul li a" the float statement was modified to "float:none !important /*Non-IE6*/; float:left /*IE-6*/;" in all "headerNN_setup.css" and "layoutNN_setup.css" files. The !important-float statement defines the behavior for Non-IE6 browsers including Opera, the other float-statement is for IE6.
Browser: All / Description: Fresh screenshots have been made for Multiflex-3.7.
December 18, 2006
Browser: IE6 / Description: When hovering the drop-down menu, the rounded-corners image from the sidebar or subcontent boxes are incorrectly placed above the drop-down menu. This bug was initiated by the changes made in Update-4 (see below) / Correction: In the CSS-class ".nav2 ul li" is modified by the parameters "z-index:auto !important /*Non-IE6*/; z-index:1000 /*IE6*/;" was added to all "headerNN_setup.css" and "layoutNN_setup.css". The !important statement is for Non-IE6 browsers, the other statement for IE6.
December 17, 2006
Breadcrumb section background
Browser: All / Description: The replacement color (when image not found) for the background in the breadcrumbs section was set to its correct value. / Correction: For the CSS-class ".header-breadcrumbs" the replacement color-value for the parameter "background" was set to "rgb(255,255,255) in all "headerNN_setup.css" and "layoutNN_setup.css" files.
Browser: Netscape / Description: Images positioned with "center" were displayed in left-justified position, but now correctly are displayed centered. / Correction: The CSS-class "img.center" was modified by including the parameter "display:block" and "width:auto" in all "layoutNN_text.css" files. As a result of this change, it is no longer necessary for the paragraph to be centered (<p class="center">) when centering images. Paragraphs containing centered images are now simply coded as "<p>", without using any classes.
Footer height adjustment
Browser: All / Description: The footer did not expand sufficiently in the vertical when browser font-sizes were increased. / Correction: For the CSS-class ".footer" the parameter "height" was removed, while top and bottom paddings were introduced in "padding", all in the "layoutNN_setup.css" files.
Sitemessage width and text
Browser: All / Description: The site message in the middle header has received an increased width. / Correction: For the CSS-class ".sitemessage" the parameter "width" was increased by 50px in all "headerNN_setup.css" and "layoutNN_setup.css" files.
Corrected top drop-down menu
Browser: All / Description: Due to the changes in Update-4, an unwanted sideeffect appeared, namely that the sticky hover zones outside the drop-down submenu were missing on the right-hand side of the menu. The only way to resolve this issue was to remove the sticky hover zones altogether. / Correction: Reformulation and simplification of the CSS-classes belonging to ".nav2" in all "headerNN_setup.css" and "layoutNN_setup.css" files.
December 11, 2006
Drop-down menu critical bug solved
Browser: All / Description: When hovering the drop-down submenu at very large font-sizes, i.e. when the menu is shown on two or more lines, the hovered submenu is now shown on top of other main menu items. Until now, the hovered submenu would erroneously appear below other menu main items, thus making it impossible to reach those submenu links. / Correction: Removed the "z-index:1000" parameter in the CSS-class ".nav2 ul li" in all "headerNN_setup.css" and "layoutNN_setup.css" files.
December 4, 2006
Browser compatibility increased
Browser: Konqueror, Netscape and Mozilla / Description: Drop-down menus now correctly open up vertically. / Correction: Added a width-specification for the CSS-class ".nav2 ul li:hover ul" in "headerNN_setup.css" and "layoutNN_setup.css".
IE flicker hack moved
Browser: All / Modification: Individual image links removed, instead a general link to my homepage directory containing the screenshots of interest. Advantage is that screenshots can be added or deleted without breaking any links in the template.
Browser: All / Modification: Designer credits now reads "Design by", instead of before "Original design by".
November 29, 2006
Printer layout and background color
Browser: All / Description: When printing, a gap was created between the header and the content section. Further, no background color was printed for the left navigation sidebar. / Correction: Removed erroneous vertical padding in CSS-class ".header-breadcrumbs in all CSS-files "layoutNN_setup.css". Further, included a printer CSS statement for the class ".main-navigation" in CSS-files "layoutNN_setup.css".
Browser: All / Modification: All template links now point to my homepage, instead of to Open Webdesign. This change was done in "index.html".
November 27, 2006
Drop-down menu items
Browser: IE7 / Description: Misbehavior when hovering main link by showing multiple columns / Correction: Reformulated conditional "if" statements in "layoutNN.html", "headerNN.html" and "index.html".
Bottom header background
Browser: All / Description: Background gap between bottom header and breadcrumbs when browser font-size reduced / Correction: Added background to the CSS-class ".bottom-header" in "layoutNN_setup.css".
Rounded corners line
Browser: All / Description: When decreasing or increasing browser font size, a horizontal line appears above the rounded corners for subcontent boxes with boundary. Effect happens when font-size resizes, but page is not reloaded. / Solution: Simply reload the page, and the horizonal line disappears. This is a Safari bug which we have no control over.
Top search form
Browser: Konqueror 3.4 / Description: Field width available for search form widened, so that "Go" button appears to the right, and not below, the search area. / Modification: CSS-class ".header-breadrumbs" changed in "headerNN_setup.css" and "layoutNN_setup.css".
Search form layout
Browser: All / Description: Search forms now have their "Go" buttons below the search entry field (only exception is search form below the page header). Reason for this is that design remains consistent when browser font-sizes are resized / Modification: CSS-class ".button" changed in "headerNN_setup.css" and "layoutNN.css".
Browser: All / Description: Default buttons are styled very differently for different browsers. / Correction: To harmonize button appearance we have now styled the buttons explicitly. However, Camino and Safari overrule this style with Mac-specific buttons. / Modification: CSS-class ".button" changed in "headerNN_setup.css", "layoutNN_setup.css" and "layoutNN_text.css".
Credits for flags
Credits were included for the flags.
November 23, 2006
First public release at Open Webdesign.
Many people ask me what tools I use. Here is the list:
Latest top website for open-source webtemplates
Maybe you have heard of the latest news in the open-source webdesign community. As of December 2006 a new community of webdesigners was launched at OpenDesigns.org, featuring some of the very best talents. If you want to stay on the cutting edge of open-source webtemplates, learn and get ideas from experienced designers in an active forum, or simply download state-of-the-art webtemplates for you to use, then this is definitely the site you want visit regularly.
Credits for ideas and reviews
Persons who contributed with ideas or CMS-portings for Multiflex-3:
- Jesse Rochman (USA) -- CMS-port to MODx.
- Ainslie Johnson (UK) -- CMS-port to WordPress.
- Martin Thumann (Germany) -- CMS-port to Contrexx.
- Ryan Thrash (USA) -- IE6 hacks using "!important".
- Stu Nicholls (UK) -- Drop-down menus.
- Big John (USA) -- CSS-hack for clearing floats.
- Sylvain Witmeyer (France) -- Bugfix drop-down menu (v. 1.8).
- Mark James (UK) -- Icons and flags.
- Wolfgang Bartelme (Austria) -- Green header background.
- Sandro Rizzetto (Italy) -- Discovery of image-paragraph bug in ver. 3.10, with solution implemented in ver. 3.10. Thanks Sandro!