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.

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

Select wrap bug #24990

Closed
dotdub opened this issue Dec 12, 2017 · 4 comments
Closed

Select wrap bug #24990

dotdub opened this issue Dec 12, 2017 · 4 comments
Labels

Comments

@dotdub
Copy link

@dotdub dotdub commented Dec 12, 2017

Building an internal database interface and came across a word-wrap bug for certain select options that are large. Only appears to be an issue with Safari/Chrome. Using v4.0-beta.

This is the code the wsgi/Jinja app puts out, the profiler is a little too long and Safari wraps the 'r'

<select name="type" class="form-control">
  <option value="1">Aquadopp Meter</option>
  <option value="2" selected="">Aquadopp Profiler</option>
  <option value="3">RDI Long Ranger</option>
  <option value="4">RDI Sentinel</option>
</select>

I am able to fix it live by adding word-wrap: normal; to the .form-control class.

@Johann-S

This comment has been minimized.

Copy link
Member

@Johann-S Johann-S commented Dec 13, 2017

Bug reports must include a live demo of the problem. Per our contributing guidelines, please create a reduced test case via CodePen or JS Bin and report back with your link, Bootstrap version, and specific browser and OS details.

@dotdub

This comment has been minimized.

Copy link
Author

@dotdub dotdub commented Dec 13, 2017

Apologies for missing that. Here is a simplified CodePen for the issue. Only appears (for me) in Safari 11.02 using macOS 10.12.6. Firefox & Chrome wrap the text properly.

https://codepen.io/dotdub/pen/qpEJmj?editors=1000#0

@Johann-S Johann-S added css v4 and removed awaiting reply labels Dec 14, 2017
@mdo

This comment has been minimized.

Copy link
Member

@mdo mdo commented Dec 23, 2017

This is coming from the .card—it has word-wrap: break-word;. Will need to revisit that.

@dotdub

This comment has been minimized.

Copy link
Author

@dotdub dotdub commented Dec 26, 2017

I identified that as the problem as well. I've addressed it temporarily with an in-page fix. I'll watch for the fix.

@mdo mdo added this to Inbox in v4.0 stable via automation Dec 28, 2017
@mdo mdo removed this from Inbox in v4.0 stable Jan 15, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
3 participants
You can’t perform that action at this time.