Bug 87336 - background no-repeat image wrapping when window is smaller than image
Summary: background no-repeat image wrapping when window is smaller than image
Status: RESOLVED FIXED
Alias: None
Product: konqueror
Classification: Applications
Component: khtml renderer (show other bugs)
Version: unspecified
Platform: unspecified NetBSD
: NOR normal with 5 votes (vote)
Target Milestone: ---
Assignee: Konqueror Developers
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2004-08-17 07:37 UTC by Kirk Jackson
Modified: 2006-10-14 17:17 UTC (History)
0 users

See Also:
Latest Commit:
Version Fixed In:


Attachments
testcase attached (448 bytes, text/html)
2004-10-26 12:12 UTC, Tommi Tervo
Details
Screenshot - Konqueror window that's wider than the image (32.26 KB, image/png)
2004-10-28 05:07 UTC, Kirk Jackson
Details
Screenshot - Konqueror window that's narrower than the image (33.09 KB, image/png)
2004-10-28 05:08 UTC, Kirk Jackson
Details

Note You need to log in before you can comment on or make changes to this bug.
Description Kirk Jackson 2004-08-17 07:37:28 UTC
Version:           3.2.3 (using KDE 3.2.3, compiled sources)
Compiler:          gcc version 3.3.3 (NetBSD nb3 20040520)
OS:                NetBSD (i386) release 2.0F

Hi,

The problem is Konqueror 3.2.3 displaying the following html - with a background image on the div that is set to no-repeat.

If the window size is larger than the image, it works correctly. If the window is sized smaller than the width of the image, the right-hand portion of the image is "wrapped" and displayed on the left hand side.

I can produce a screenshot if requested.

Thanks for your help,

Kirk

<!doctype html public "-//w3c//dtd html 4.0 transitional//en" >
<html>
<head>
	<title>title</title>
	<style>
	
div#outer
{
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	background: #336666 url("http://www.google.co.nz/logos/summer2004_swimming.gif") no-repeat fixed 50px 0px;
	
}
	</style>
</head>
<body>
	<div id="outer">
	<p>
	    Text goes here<br />
	    Text goes here
	</p>
	</div>
</body>
</html>
Comment 1 Tommi Tervo 2004-10-26 12:12:13 UTC
Created attachment 8039 [details]
testcase attached

Cannot reproduce. Attach a screenshot if you still can reproduce this bug.
Comment 2 Kirk Jackson 2004-10-28 05:07:02 UTC
Created attachment 8062 [details]
Screenshot - Konqueror window that's wider than the image
Comment 3 Kirk Jackson 2004-10-28 05:08:19 UTC
Created attachment 8063 [details]
Screenshot - Konqueror window that's narrower than the image

Note that when the window is narrower than the image, the image wraps around
into the left hand margin area.

This happens with the test case already attached to this bug.

Cheers,

Kirk
Comment 4 Stephen Leaf 2005-03-18 19:10:07 UTC
This bug is not just limited to horizontally but also vertically

<table cellpadding="0" cellspacing="0">
	<tr>
		<td rowspan="3">
			<img src="leftboard.jpg" height="413px" width="46px" />
		</td>
		<td style="background-image:url(topboard.jpg); height:33px; width:488px; background-position:0px 18px; background-repeat:no-repeat">&nbsp;</td>
		<td rowspan="3">
			<img src="rightboard.jpg" height="413px" width="46px" />
		</td>
	</tr>

This is how I ran across this bug.
my image is 33pixels tall. strangely tho changing the cell's height to 34 fixed it.
Comment 5 Christiaan Hees 2005-04-23 16:37:46 UTC
The same problem exists in Konqueror 3.3.2.
Screenshot/htmlsource available on request.
Comment 6 Allan Sandfeld 2006-10-14 17:17:21 UTC
SVN commit 595508 by carewolf:

Add sanity to fixed background painting as well.
BUG: 87336


 M  +10 -8     render_box.cpp  


--- branches/KDE/3.5/kdelibs/khtml/rendering/render_box.cpp #595507:595508
@@ -568,24 +568,26 @@
             calculateBackgroundSize(bgLayer, scaledImageWidth, scaledImageHeight);
             EBackgroundRepeat bgr = bgLayer->backgroundRepeat();
 
-            if( (bgr == NO_REPEAT || bgr == REPEAT_Y) && pw > scaledImageWidth ) {
-                cw = scaledImageWidth;
-                cx = vr.x() + bgLayer->backgroundXPosition().minWidth(pw - scaledImageWidth);
+            int xPosition = bgLayer->backgroundXPosition().minWidth(pw-scaledImageWidth);
+            if (bgr == NO_REPEAT || bgr == REPEAT_Y) {
+                cw = kMin(scaledImageWidth, pw - xPosition);
+                cx = vr.x() + xPosition;
             } else {
                 cw = pw;
                 cx = vr.x();
                 if (scaledImageWidth > 0)
-                    sx = scaledImageWidth - bgLayer->backgroundXPosition().minWidth(pw - scaledImageWidth) % scaledImageWidth;
+                    sx = scaledImageWidth - xPosition % scaledImageWidth;
             }
 
-            if( (bgr == NO_REPEAT || bgr == REPEAT_X) && ph > scaledImageHeight ) {
-                ch = scaledImageHeight;
-                cy = vr.y() + bgLayer->backgroundYPosition().minWidth(ph - scaledImageHeight);
+            int yPosition = bgLayer->backgroundYPosition().minWidth(ph-scaledImageHeight);
+            if (bgr == NO_REPEAT || bgr == REPEAT_X) {
+                ch = kMin(scaledImageHeight, ph - yPosition);
+                cy = vr.y() + yPosition;
             } else {
                 ch = ph;
                 cy = vr.y();
                 if (scaledImageHeight > 0)
-                    sy = scaledImageHeight - bgLayer->backgroundYPosition().minWidth(ph - scaledImageHeight) % scaledImageHeight;
+                    sy = scaledImageHeight - yPosition % scaledImageHeight;
             }
 
             QRect fix(cx, cy, cw, ch);