[prev in list] [next in list] [prev in thread] [next in thread]
List: kde-bugs-dist
Subject: [Bug 146165] New: Konqueror not applying CSS to MENU elements
From: Ambrose Li <ambrose.li () gmail ! com>
Date: 2007-05-30 16:21:11
Message-ID: 20070530182109.146165.ambrose.li () gmail ! com
[Download RAW message or body]
------- You are receiving this mail because: -------
You are on the CC list for the bug, or are watching someone who is.
http://bugs.kde.org/show_bug.cgi?id=146165
Summary: Konqueror not applying CSS to MENU elements correctly
Product: konqueror
Version: unspecified
Platform: Debian testing
OS/Version: Linux
Status: UNCONFIRMED
Severity: normal
Priority: NOR
Component: general
AssignedTo: konq-bugs kde org
ReportedBy: ambrose.li gmail com
Version: 3.5.3 (using KDE KDE 3.5.5)
Installed from: Debian testing/unstable Packages
OS: Linux
Given identical HTML and identical CSS, except for the difference that one uses the \
MENU tag and the other uses the UL tag, Konqueror will render the one that uses MENU \
in a very inconsistent way. \
\
The following HTML snippet illustrates the problem: \
\
----------- cut here -------------- 8< ----------------------------- \
<style type="text/css"> \
\
html, body { \
color: black; \
background-color: white; \
} \
\
/* All links */ \
#topnav a { \
text-decoration: none; \
color: inherit; \
padding-left: 0.5em; \
padding-right: 0.5em;
} \
#topnav a:hover { \
color: white; \
background-color: black; \
} \
#topnav ul { \
list-style: none; \
} \
\
/* Main horizontal menu */ \
#topnav ul li { \
float: left; \
} \
\
/* Submenus */ \
#topnav li > ul { \
display: none; \
} \
#topnav li:hover > ul { \
display: block; \
} \
#topnav li ul { \
position: absolute; \
float: none; \
padding-left: 0;
border: 2px solid black; \
} \
#topnav li ul li { \
display: block; \
position: relative; \
float: none; \
} \
#topnav li ul li a { \
display: block; \
} \
\
</style> \
\
<div id=topnav> \
<ul> \
<li><a href="#">File</a> \
<ul> \
<li><a href="#">New</a> \
<li><a href="#">Open</a> \
<li><a href="#">Close</a> \
<li><a href="#">Save</a> \
<li><a href="#">Quit</a> \
</ul> \
<li><a href="#">Edit</a> \
<ul>
<li><a href="#">Undo</a> \
<li><a href="#">Cut</a> \
<li><a href="#">Copy</a> \
<li><a href="#">Paste</a> \
</ul> \
<li><a href="#">View</a> \
<li><a href="#">Help</a> \
</ul> \
</div> \
----------- cut here -------------- 8< ----------------------------- \
\
This will generate a screen that looks like a normal GUI with File, \
Edit, View and Help menus. If the user hovers the cursor over File \
or Edit, a submenu is displayed; i.e., the screen looks like this: \
\
File Edit View Help \
\
and, when hovered over File, \
\
File Edit View Help \
New \
Open \
Close \
Save \
Quit
\
and, when hovered over Edit, \
\
File Edit View Help \
Undo \
Cut \
Copy \
Paste \
\
This is also the way Mozilla displays the HTML. \
\
If the "ul" tags are replaced with "menu" tags, the screen will \
look completely garbled like this: \
\
File New Open Close Save Quit * Edit \
* View \
* Help \
\
The visible differences between this and how Konqueror renders the \
"ul" version are: \
\
- The first submenu are interspersed between File and Edit \
\
- Unexpected bullets and alignment for the last 3 items \
The inconsistencies seem to be caused by Konqueror being confused \
by nested MENU elements, as can be seen from the following symptoms: \
\
- The text contained inside the LI elements inside the nested MENU \
are displayed as if they were part of the outermost MENU \
\
- The close tag of the nested MENU caused Konqueror to think that \
the outermost MENU has closed \
\
- Subsequent LI elements seem to have caused Konqueror to insert \
an implicit UL, thus causing the styling for MENU (specifically \
the list-style and float properties) to be not applied \
\
- The Edit MENU is nested within the implicit UL (if UL is indeed \
the implicitly-inserted tag), and Konqueror is thus not confused \
by the nesting, and displays the submenu as expected \
\
The behaviour of MENU should be identical to UL. So nested MENU's \
are definitely allowed.
---
Note for Debian people: MENU is a valid element in 4.01, and the test case is \
rendered correctly by both Firefox and Safari.
[prev in list] [next in list] [prev in thread] [next in thread]
Configure |
About |
News |
Add a list |
Sponsored by KoreLogic