search

fomantic / Fomantic-UI

Fomantic-UI is the official community fork of Semantic-UI
https://fomantic-ui.com
MIT License
3.55k stars 330 forks source link

[grid] One wide column not inline when on tiny screen #2856

Open daveharris opened 1 year ago

daveharris commented 1 year ago

Bug Report

With a screen size of 447px and smaller, when a grid contains a one wide column, the subsequent column is forced onto the next line, even though the number of columns is exactly 16. Displaying on a screen size larger than 448px displays correctly. Changing to two wide column (and fourteen wide column) also works correctly.

Steps to reproduce

  1. Create a ui grid containing a one wide column and a fifteen wide column
  2. Reduce your window width to 447px

Expected result

The fifteen wide column is displayed next to the one wide column

Actual result

The fifteen wide column is displayed under the one wide column. You can see on the jsfiddle that the second ui grid with a two wide column and a fourteen wide column always displays correctly.

Testcase

https://jsfiddle.net/xvzns35r/1/

Screenshot (if possible)

Screenshot 2023-07-26 at 2 38 21 PM

Screen Recording 2023-07-26 at 2 36 32 PM

Version

2.9.2

JaiminR28 commented 12 months ago

can i work upon it ?

lubber-de commented 12 months ago

Sure

JaiminR28 commented 12 months ago

I think this issue has been solved in the version 2.9.3 .

daveharris commented 12 months ago

@JaiminR28 I don't think so, the JSFiddle is referencing https://fomantic-ui.com/dist/semantic.js and https://fomantic-ui.com/dist/semantic.css which is currently at 2.9.3:

/*
 * # Fomantic UI - 2.9.3
 * https://github.com/fomantic/Fomantic-UI
 * https://fomantic-ui.com/
 ...
JaiminR28 commented 12 months ago

ok i'll try to look into it.