Semantic-UI icon indicating copy to clipboard operation
Semantic-UI copied to clipboard

[Tab] - Evenly divided tabs pixel offset between last tab and segment

Open larsbo opened this issue 8 years ago • 4 comments

Steps to Reproduce

  1. Create an evenly divided tabular menu, e.g. ui top attached three item tabular menu.
  2. Create corresponding segments, e.g. ui bottom attached tab segment.
  3. add required javascript, e.g. $('.menu .item').tab();.

Expected The border of the last tab of an evenly divided tabluar menu should match with the border of the attached segment.

Result There is a small offset (1 pixel) between tab border and segment border.

Testcase http://jsfiddle.net/9ux939ro/ (second example)

larsbo avatar Jul 07 '16 07:07 larsbo

Was playing around with tabs today and noticed it.

it happens because of this:

.ui.attached.segment {
    width: calc(100% + 2px );
    max-width: calc(100% + 2px );

if you set

calc(100% + 1px);

it's fixed

vinayakkulkarni avatar Mar 15 '17 21:03 vinayakkulkarni

This might be related: #4248.

awgv avatar Mar 15 '17 21:03 awgv

There has been no activity in this thread for 90 days. While we care about every issue and we’d love to see this fixed, the core team’s time is limited so we have to focus our attention on the issues that are most pressing. Therefore, we will likely not be able to get to this one.

However, PRs for this issue will of course be accepted and welcome!

If there is no more activity in the next 90 days, this issue will be closed automatically for housekeeping. To prevent this, simply leave a reply here. Thanks!

stale[bot] avatar Jun 05 '18 20:06 stale[bot]

Seems to be fixed in the community fork Fomantic-UI by https://github.com/fomantic/Fomantic-UI/pull/1480 See your adjusted jsfiddle here http://jsfiddle.net/lubber/cr9xhogn/

lubber-de avatar Aug 20 '21 16:08 lubber-de