Skip to content
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.

Sign up for GitHub

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

Doubled border/phantom box for images with block display style #332

Open
bblhd opened this issue Dec 29, 2024 · 1 comment
Open

Doubled border/phantom box for images with block display style #332

bblhd opened this issue Dec 29, 2024 · 1 comment

Comments

@bblhd
Copy link

bblhd commented Dec 29, 2024

Hello! When styling an image in dillo, if you give it the property display: block; and also a border, such as border: 1px solid black;, it will draw two borders around the image, one around the image itself, and one where the image's margin should be, also doubling the margin.

It seems to be creating a box around the image with the same style properties as the image?

Minimal demonstration:

<!DOCTYPE html>
<html>
<head>
<title>Demonstation</title>
<style>*{margin: 10px; padding 10px; border: 5px solid black; display: block;}</style>
</head>
<body>
<div style='border-color: blue;'>
<img style='border-color: red;' src='https://upload.wikimedia.org/wikipedia/commons/thumb/f/f3/Youngkitten.JPG/320px-Youngkitten.JPG'/>
</div>
</body>
</html>

How dillo renders it (for me):

doubledborder
@rodarima
Copy link
Member

Thanks for the report, it is hard to find a proper issue nowadays, even less
with a working reproducer.

This seems to be coming from the current implementation for block and
display-block, which is internally done by wrapping the image in another
container which seems to be also getting the same style.

I'll try to find a quick workaround. Otherwise I'll probably address this after
3.2.0, as this may require changing the way the block elements are implemented.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@rodarima @bblhd