Menu
For some reason, when using a dotted border style to make a line, Chrome renders the ends as double dots, which looks awful especially on short lines:
.text {
border-bottom: 2px dotted #000;
}<span class="text">Hi</span><br/>
<span class="text">lll</span><br/>
<span class="text">22</span><br/>Even something as simple as border-bottom: 2px dotted #000; doesn't work. I saw some article suggest setting left/right borders to transparent, but that looks even worse at it cuts off small corners of the dots.
It looks fine in Firefox, though. Is there any way to make it look as good in Chrome, or am I out of luck?
681
Removing Dotted Lines Border Select the cells from which you want to remove the dotted border. Click the Home tab. In the Font group, click on the 'Border' drop-down. In the border options that appear, click on 'No Border'
The dashed or dotted line is known to diminish the boundary strength of an object, reducing its salience, which is one reason we interpret it as “lesser” than an object with a solid line. When you see a speech bubble outlined with a dashed line, you might interpret it as a whisper or an “off-stage” comment.
It shows the available space where text can be expanded. You can see this dashed area after text which means it is area where text can be expanded.
DevTools assigns scripts random colors. In Figure 16, function calls from one script are colored light green. Calls from another script are colored beige. The darker yellow represents scripting activity, and the purple event represents rendering activity.
You could absolutely position a pseudo element with the border properties and offset the position by the "dot" width to hide the first and last dots that are rendering as double dots.
.text {
position: relative;
overflow: hidden;
display: inline-block;
}
.text::after {
border-bottom: 2px dotted #000;
content: '';
position: absolute;
bottom: 0; left: -2px; right: -2px;
}<span class="text">Hi</span><br/>
<span class="text">lll</span><br/>
<span class="text">22</span><br/>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
