mirror of
https://github.com/tenrok/bootstrap.git
synced 2026-06-14 18:42:30 +03:00
Restyle code element, remove docs example overflow, improve docs examples (#25054)
* Restyle code element, clean up variables - Removes the padding and background-color - Changes the color to a brand color () - Add new variables to kbd element styles to account for removing the code ones - Remove overrides that were needed previously * only break between words, and override it in the pre * make file inputs 100% wide * scope custom file changes in input group for sizing * shorter button labels for responsive * narrower cards * button was too wide * downsize * fewer links in pagination * redo cell text * improve overflow docs
This commit is contained in:
@@ -262,17 +262,7 @@ Vertically move one flex item to the top or bottom of a container by mixing `ali
|
||||
Change how flex items wrap in a flex container. Choose from no wrapping at all (the browser default) with `.flex-nowrap`, wrapping with `.flex-wrap`, or reverse wrapping with `.flex-wrap-reverse`.
|
||||
|
||||
<div class="bd-example">
|
||||
<div class="d-flex flex-nowrap bd-highlight">
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="d-flex flex-nowrap bd-highlight" style="width: 8rem;">
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
<div class="p-2 bd-highlight">Flex item</div>
|
||||
|
||||
@@ -32,13 +32,8 @@ For left, right, and center alignment, responsive classes are available that use
|
||||
Prevent text from wrapping with a `.text-nowrap` class.
|
||||
|
||||
{% example html %}
|
||||
<div class="row">
|
||||
<div class="col-1 text-nowrap">
|
||||
Curabitur blandit tempus ardua ridiculus sed magna.
|
||||
</div>
|
||||
<div class="col-11">
|
||||
<img data-src="holder.js/50x50" alt="An image to show the text doesn't wrap">
|
||||
</div>
|
||||
<div class="text-nowrap bd-highlight" style="width: 8rem;">
|
||||
This text should overflow the parent.
|
||||
</div>
|
||||
{% endexample %}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user