search

Hufe921 / canvas-editor

rich text editor by canvas/svg
https://hufe.club/canvas-editor-docs
MIT License
3.7k stars 553 forks source link

默认CursorAgent定位问题 #878

Closed ssdutnowind closed 2 weeks ago

ssdutnowind commented 2 weeks ago

version

一直存在

Link to minimal reproduction

No response

Steps to reproduce

下面这段css可能是有问题的，因为既设置了width，又设置了left、right，可能实际需要的是top: 0, left: 0。 .ce-inputarea { width: 100px; height: 30px; min-width: 0; min-height: 0; margin: 0; padding: 0; left: 0; right: 0; letter-spacing: 0;

image

官方的Demo实际运行看不出什么问题，是因为底部有很大的margin，但是如果优化布局调小底部的margin，就会发现初始化后点击页面获取光标时，页面高度会明显的缩小一下（因为CurosrAgent被重新定位后底部就不会被顶出额外的空间）。

What is expected?

无。

What is actually happening?

无。

Editor Value

No response

System Info

No response

Any additional comments?

No response

Hufe921 commented 2 weeks ago

absolute定位：元素会被移出正常文档流，不占用空间。 没有理解你说的问题，可以给出一个最小可复现demo

ssdutnowind commented 2 weeks ago

absolute定位：元素会被移出正常文档流，不占用空间。 没有理解你说的问题，可以给出一个最小可复现demo 目前的写法对editor自身没什么影响，但是外层UI界面不同的布局方式会有影响。

可以修改/src/style.css， 783行，将下margin由80px改为30px为例来复现： .editor>div { margin: 80px auto 30px; }

1、直接用示例带有内容初始化编辑器，或者空白编辑器亦可； 2、滚动到页面最低端（这样现象观察起来会比较明显）； 3、然后点击编辑区域普通文本使光标定位到编辑器内。