Closed Bug 60562 Opened 24 years ago Closed 23 years ago

Icons are aligned vertically instead of horizontally

Categories

(Core :: Layout: Tables, defect, P3)

Product:
Core
Component:
Layout: Tables
Platform:
x86
All
Type:
defect

Tracking

()

Status:
VERIFIED DUPLICATE of bug 54565
Milestone:
mozilla1.0

People

(Reporter: ralf.lange, Assigned: attinasi)

References

(
URL
)

Details

(Keywords: qawanted, testcase)

Attachments

(1 file)

Testcase
544 bytes, text/html
Details 
The given URL consists of some frames. The frame
http://otn.oracle.com/products/ifs/p_tabs.htm
aligns its icons icons vertically instead of horizontally. This happens on
Mozilla Build 2000111708 and older. I checked this behaviour on SuSE Linux 7.0,
SuSE Linux 6.4 and Windows 2000.
The frame's html code is attached below.
<html>
<head>
<title>Technology Navigation Banner</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="ROBOTS" content="NOINDEX,FOLLOW">
<script language="JavaScript" src="/jscripts/navimages.js"></script>
<script language="JavaScript">
<!--
var selected_tab = "none"
var tab_load = "true"

function SetTab(){
	if (parent.category=="Info"){selected_tab="nav_home_bar"; SwapImage(selected_tab);}
	if (parent.category=="Software"){selected_tab="nav_soft_bar";
SwapImage(selected_tab);}
	if (parent.category=="Documentation"){selected_tab="nav_doc_bar";
SwapImage(selected_tab);}
	if (parent.category=="Sample Code"){selected_tab="nav_sample_code_bar";
SwapImage(selected_tab);}
	if (parent.category=="Training"){selected_tab="nav_training_bar";
SwapImage(selected_tab);}
	if (parent.category=="Support"){selected_tab="nav_support_bar";
SwapImage(selected_tab);}
	if (parent.category==""){selected_tab="none"}
}

function ChangeTabs(image_name){
	RestoreImage(selected_tab)
	SwapImage(image_name)
	selected_tab = image_name
}

function CheckTabs(image_name){
	if(selected_tab != image_name){
		ChangeTabs(image_name)
	}
}

// -->
</script>
</head>

<body bgcolor="#FFFFFF" onLoad="preCacheTabs(); SetTab()">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td><img src="images/nav_home_bar.gif" height="5" name="nav_home_bar"><img
src="/images/tabs/nav_soft_bar.gif" width="56" height="5"
name="nav_soft_bar"><!-- ## Comment out tabs ##   <img
src="/images/tabs/nav_beta_release_bar.gif" width="77" height="5"
name="nav_beta_release_bar"> --><img src="/images/tabs/nav_doc_bar.gif"
width="86" height="5" name="nav_doc_bar"><!-- ## Comment out tabs ##   <img
src="/images/tabs/nav_sample_code_bar.gif" width="75" height="5"
name="nav_sample_code_bar"><img src="/images/tabs/nav_training_bar.gif"
width="51" height="5" name="nav_training_bar"> --><img
src="/images/tabs/nav_support_bar.gif" width="50" height="5"
name="nav_support_bar"></td>
    <td width="100%" bgcolor="666666" align="right"><img
src="/images/white_spacer.gif" width="1" height="5"></td>
  </tr>
  <tr>
    <td><a href="listing.htm" target="content"
onMouseOver="SwapImage('nav_home')" onMouseOut="RestoreImage('nav_home')"
onClick="ChangeTabs('nav_home_bar')"><img src="images/nav_home.gif" height="20"
border="0" name="nav_home"></a><a
href="/software/products/ifs/htdocs/listing.htm" target="content"
onMouseOver="SwapImage('nav_soft')" onMouseOut="RestoreImage('nav_soft')"
onClick="ChangeTabs('nav_soft_bar')"><img src="/images/tabs/nav_soft.gif"
width="56" height="20" border="0" name="nav_soft"></a><a
href="/docs/products/ifs/listing.htm" target="content"
onMouseOver="SwapImage('nav_doc')" onMouseOut="RestoreImage('nav_doc')"
onClick="ChangeTabs('nav_doc_bar')"><img src="/images/tabs/nav_doc.gif"
width="86" height="20" border="0" name="nav_doc"></a><!-- ##Comment out tabs##
<a href="/sample_code/ifs/listing.htm" target="content"
onMouseOver="SwapImage('nav_sample_code')"
onMouseOut="RestoreImage('nav_sample_code')"
onClick="ChangeTabs('nav_sample_code_bar')"><img
src="/images/tabs/nav_sample_code.gif" width="75" height="20" border="0"
name="nav_sample_code"></a><a href="/training/ifs/listing.htm" target="content"
onMouseOver="SwapImage('nav_training')"
onMouseOut="RestoreImage('nav_training')"
onClick="ChangeTabs('nav_training_bar')"><img
src="/images/tabs/nav_training.gif" width="51" height="20" name="nav_training"
border="0"></a> --><a href="/support/products/ifs/listing.htm" target="content"
onMouseOver="SwapImage('nav_support')" onMouseOut="RestoreImage('nav_support')"
onClick="ChangeTabs('nav_support_bar')"><img src="/images/tabs/nav_support.gif"
width="50" height="20" name="nav_support" border="0"></a></td>
    <td>&nbsp;</td>
  </tr>
</table>
</body>
</html>
*** Bug 60563 has been marked as a duplicate of this bug. ***
Attached file Testcase — 

    
    

    
  
<td width="100%"> is too eager. NN4.7, IE5 and Opera4.02 all get this right.
Assignee: clayton → karnaze
Status: UNCONFIRMED → NEW
Component: Layout → HTMLTables
Ever confirmed: true
Keywords: 4xp, 
          
            testcase
OS: Linux → All
QA Contact: petersen → chrisd

    
    

    
  
*** Bug 62065 has been marked as a duplicate of this bug. ***

    
    

    
  
This is one of the bugs dedicated to <td width="100%">. Is this a dup of bug
19591? If it is not a dup, I suggest we open a new bug stating clearly that <td
width="100%"> doesn't work correctly, and we dup the numerous bugs to that new bug.
Fabian

    
    

    
  
Bug 19591 has been marked worksforme, but this still appears. Could anyone say
whether <td width="100%"> is valid html and whether this should be kept open?

    
    

    
  
*** Bug 66321 has been marked as a duplicate of this bug. ***

    
    

    
  
*** Bug 68186 has been marked as a duplicate of this bug. ***

    
    

    
  
Yes, Fabian, <td width="100%"> is valid html. Just take a look at the specs at: 

http://www.w3.org/TR/html4/struct/tables.html#column-width

    
    

    
  
And this is very important: "Note that this space does not depend on the table
itself, and thus percentage specifications enable incremental rendering."

    
    

    
  
HJ, thanks for looking at the specs, but you have read them wrong. This bug
happens because there is a <td width="100%">. Your link refers to columns only,
i.e. COLGROUP and COL tags. We are talking about TD. Please scroll down by about
three screens to the TH/TD section, and read that "width=length" is deprecated
(so is height). So the correct behavior would be to put the width on the col
tag, not on the width tag. I never doubted that <col width="100%"> is valid. But
since the w3c tells us that we have to support it anyway (backwards
compatibility), I guess we should work this out.
A comment from the HTMLTables folks would be appreciated, thanks.
Keywords: qawanted

    
    

    
  
Arg, i just took the wrong link from my W3C bookmarks, sorry for that.

    
    

    
  
QA contact update
QA Contact: chrisd → amar

    
    

    
  
*** Bug 74890 has been marked as a duplicate of this bug. ***

    
    

    
  
Has anyone figured out whether this will be determined to be a bug or incorrect
html?  I would have thought that eve if there was a <td width="50" nowrap><td
width="100%"> that the nowrap would be respected.

I have not looked through the specs in detail and I understand this is incorrect
table syntax, however I have come across this in a number of places before.

    
    

    
  
For me this bug lookes like a dupe of bug 30596.

just a quote from this bug (karnaze):
This is probably the infamous images in a cell without whitespace problem.


    
    

    
  
The URLs in bug 30596 does not have any <td width=100%>

    
    

    
  
I think, what happens here, is that the minimal content width for the first
table cell is determined by the size of the largest image instead of the first
four images together. The second cell demands 100% so the first cell is grown to
the minimum width spanning the largest image, the remaining space is given to
the second cell. The problem comes from the fact that mozilla thinks it can
introduce linebreaks between the images. Under this view this bug is indeed the
"infamous images in a cell without whitespace problem". if you reduce the
percent size of the second cell it will first hold two images on a line, and if
further reduced it will layout all images in a single line. These linebreaks can
easily be suppressed by <td nowrap>.

    
    

    
  
Reassigning to attinasi. This may be a dup of an old bug where we don't treat 
images without whitespace between them as inseparable and IE does.
Assignee: karnaze → attinasi
Target Milestone: --- → mozilla1.0
Status: NEW → RESOLVED
Closed: 23 years ago
Resolution: --- → DUPLICATE

    
    

    
  

*** This bug has been marked as a duplicate of 54565 ***

    
    

    
  
 This bug has many dupes.. Verified that this is a dupe of bug # 32191
Status: RESOLVED → VERIFIED

          You need to log in
          before you can comment on or make changes to this bug.
        






  

    
  







  

    

      
Attachment

      

      
      
      
      
    

    

      

        

          

            
General

            

              Creator: 



            

            
Created: 

            
Updated: 

            
Size: