Skip to content

/ servo

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Absolute positioned images with padding do not have correct size #18706

Closed
ocerman opened this issue Oct 2, 2017 · 2 comments
Closed

Absolute positioned images with padding do not have correct size #18706

ocerman opened this issue Oct 2, 2017 · 2 comments
Labels
A-layout/inline C-has-manual-testcase

Comments

@ocerman
Copy link

@ocerman ocerman commented Oct 2, 2017 •
edited by nox

servo-imgsz

<!DOCTYPE html>
<html><body>
	<style>
		img{
			position: absolute; top: 0px; left: 0px; padding: 100px;
		}
		
		.box{
			width: 350px; height: 350px; position: relative; background: lightgray;
		}
	</style>

	<div class="box">
		<img src="https://upload.wikimedia.org/wikipedia/commons/2/23/Skoda_logo.gif" alt="img">
	</div>

</body></html>
@jdm jdm added the A-layout/inline label Oct 2, 2017
@bobthekingofegypt
Copy link
Contributor

@bobthekingofegypt bobthekingofegypt commented Nov 11, 2017

It is alright to work on this?

I think I know what is wrong, just need to check the change doesn't break anything and add a reftest
@bobthekingofegypt bobthekingofegypt mentioned this issue Nov 11, 2017
Merged
4 of 5 tasks complete
@bobthekingofegypt
Copy link
Contributor

@bobthekingofegypt bobthekingofegypt commented Nov 11, 2017

I created the pull request but I'm not 100% sure that all paths through are now going to work as all paths in https://github.com/servo/servo/blob/master/components/layout/block.rs#L232 are not exercised by my tests. I'm not sure how to get block_start_margin and block_end_margin to match with Auto. Also I wanted to see if all the tests pass.

The fix counters the use of border_box at https://github.com/servo/servo/blob/master/components/layout/block.rs#L1262. border_box already includes the padding so the later addition off padding to size causes the bug.
bors-servo added a commit that referenced this issue Nov 11, 2017
@bors-servo
Auto merge of #19184 - bobthekingofegypt:fix/18706-abs-image-with-pad…
Loading status checks…
7acdfdb 
…ding, r=<try>

fix block size for absolute replaced element

Absolutely replaced elements with padding were incorrectly setting their
block size to include twice the padding values.  This attempts to stop
that extra padding for replaced elements but leave the working flow for
non replaced elements

<!-- Please describe your changes on the following line: -->

---
<!-- Thank you for contributing to Servo! Please replace each `[ ]` by `[X]` when the step is complete, and replace `__` with appropriate data: -->
- [X] `./mach build -d` does not report any errors
- [X] `./mach test-tidy` does not report any errors
- [X] These changes fix #18706 (github issue number if applicable).

<!-- Either: -->
- [X] There are tests for these changes OR
- [ ] These changes do not require tests because _____

<!-- Also, please make sure that "Allow edits from maintainers" checkbox is checked, so that we can help you if you get stuck somewhere along the way.-->

<!-- Pull requests that do not address these steps are welcome, but they will require additional verification as part of the review process. -->

<!-- Reviewable:start -->
---
This change is [<img src="https://reviewable.io/review_button.svg" height="34" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/19184)
<!-- Reviewable:end -->
bors-servo added a commit that referenced this issue May 25, 2018
@bors-servo
Auto merge of #19184 - bobthekingofegypt:fix/18706-abs-image-with-pad…
Verified
This commit was created on GitHub.com and signed with a verified signature using GitHub’s key.
GPG key ID: 4AEE18F83AFDEB23 Learn about signing commits
Loading status checks…
2e20753 
…ding, r=mbrubeck

fix block size for absolute replaced element

Absolutely replaced elements with padding were incorrectly setting their
block size to include twice the padding values.  This attempts to stop
that extra padding for replaced elements but leave the working flow for
non replaced elements

<!-- Please describe your changes on the following line: -->

---
<!-- Thank you for contributing to Servo! Please replace each `[ ]` by `[X]` when the step is complete, and replace `__` with appropriate data: -->
- [X] `./mach build -d` does not report any errors
- [X] `./mach test-tidy` does not report any errors
- [X] These changes fix #18706 (github issue number if applicable).

<!-- Either: -->
- [X] There are tests for these changes OR
- [ ] These changes do not require tests because _____

<!-- Also, please make sure that "Allow edits from maintainers" checkbox is checked, so that we can help you if you get stuck somewhere along the way.-->

<!-- Pull requests that do not address these steps are welcome, but they will require additional verification as part of the review process. -->

<!-- Reviewable:start -->
---
This change is [<img src="https://reviewable.io/review_button.svg" height="34" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/19184)
<!-- Reviewable:end -->
bors-servo added a commit that referenced this issue Jun 30, 2018
@bors-servo
Auto merge of #19184 - bobthekingofegypt:fix/18706-abs-image-with-pad…
Verified
This commit was created on GitHub.com and signed with a verified signature using GitHub’s key.
GPG key ID: 4AEE18F83AFDEB23 Learn about signing commits
Loading status checks…
82e2450 
…ding, r=mbrubeck

fix block size for absolute replaced element

Absolutely replaced elements with padding were incorrectly setting their
block size to include twice the padding values.  This attempts to stop
that extra padding for replaced elements but leave the working flow for
non replaced elements

<!-- Please describe your changes on the following line: -->

---
<!-- Thank you for contributing to Servo! Please replace each `[ ]` by `[X]` when the step is complete, and replace `__` with appropriate data: -->
- [X] `./mach build -d` does not report any errors
- [X] `./mach test-tidy` does not report any errors
- [X] These changes fix #18706 (github issue number if applicable).

<!-- Either: -->
- [X] There are tests for these changes OR
- [ ] These changes do not require tests because _____

<!-- Also, please make sure that "Allow edits from maintainers" checkbox is checked, so that we can help you if you get stuck somewhere along the way.-->

<!-- Pull requests that do not address these steps are welcome, but they will require additional verification as part of the review process. -->

<!-- Reviewable:start -->
---
This change is [<img src="https://reviewable.io/review_button.svg" height="34" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/19184)
<!-- Reviewable:end -->
bors-servo added a commit that referenced this issue Jul 14, 2018
@bors-servo
Auto merge of #19184 - bobthekingofegypt:fix/18706-abs-image-with-pad…
Verified
This commit was created on GitHub.com and signed with a verified signature using GitHub’s key.
GPG key ID: 4AEE18F83AFDEB23 Learn about signing commits
Loading status checks…
3961e8d 
…ding, r=mbrubeck

fix block size for absolute replaced element

Absolutely replaced elements with padding were incorrectly setting their
block size to include twice the padding values.  This attempts to stop
that extra padding for replaced elements but leave the working flow for
non replaced elements

<!-- Please describe your changes on the following line: -->

---
<!-- Thank you for contributing to Servo! Please replace each `[ ]` by `[X]` when the step is complete, and replace `__` with appropriate data: -->
- [X] `./mach build -d` does not report any errors
- [X] `./mach test-tidy` does not report any errors
- [X] These changes fix #18706 (github issue number if applicable).

<!-- Either: -->
- [X] There are tests for these changes OR
- [ ] These changes do not require tests because _____

<!-- Also, please make sure that "Allow edits from maintainers" checkbox is checked, so that we can help you if you get stuck somewhere along the way.-->

<!-- Pull requests that do not address these steps are welcome, but they will require additional verification as part of the review process. -->

<!-- Reviewable:start -->
---
This change is [<img src="https://reviewable.io/review_button.svg" height="34" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/19184)
<!-- Reviewable:end -->
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
A-layout/inline C-has-manual-testcase
Projects
None yet
Milestone
No milestone
Linked pull requests

Successfully merging a pull request may close this issue.

fix block size for absolute replaced element
4 participants
@jdm @nox @bobthekingofegypt @ocerman
You can’t perform that action at this time.