Bootstrap columns look weird [closed] - html

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
I'm having some problems with my bootstrap columns, please check this screenshot to see what I'm talking about.
http://prntscr.com/9g11ua
Shouldn't the columns be inline?

go one line before the problematic column and add this:
<div class="clearfix visible-<the size of the column>"></div>
for instance: let's say that the problem happens when the size of the column(lg-6) goes from lg to md then you need to put the problematic situation like so:
<div class="clearfix visible-sm"></div>
let me know if it worked :)

Have you added padding to children of first div having col-lg-6 class?

Related

Numbers are distorting in Div [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 1 year ago.
Improve this question
I have a div in which numbers are squeezing when numbers are reaching more than 100 thousand like 11295551.25
<div class="col-2 text-right pr-0 "><%# Eval("CreditLimit", "{0:c}").ToString().Replace(".", ".</div><div class='col-1 pl-0'>") %></div>
My bootstrap class is creating problem, i need to rectify that.here is booststrap col-2 which is creating problem.
col-2{-ms-flex:0 0 16.666667%;flex:0 0 16.666667%;max-width:16.666667%;word-wrap: break-word}
You should use CSS attribute word-break as following:
word-break: break-word;
on your CSS class col-currency because it,s about displaying money.
Hopefully, you will be good with this approach, let me know if it helps you out!

How to make <li> bullet show at the top of its content instead of the bottom? [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 2 years ago.
Improve this question
I was just wondering if there's a quick and easy way to make an <li> bullet show at the top of its content instead of the bottom. This is just a simple <ul> with 4 <li>'s. See picture below for reference.
Screenshot
HTML snippet
I figured it out! I just need to add the d-block bootstrap class to the label to override the default display-inline-block CSS of the label.

How to Make columns in row [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 2 years ago.
Improve this question
Hi i want to know that how can we create column in a row with html and css.
Like this in the picture.1
You can try using one row like container, inside create 4 div's and add display flex and justify-content.
You could use Flex Box to have a single row of items and use the boxes to space appropriately, this will also provide scaling for different screen sizes.
Here is a link to a great explaination of what Flex Box can do: https://css-tricks.com/snippets/css/a-guide-to-flexbox/
If that's not what you're looking for, there's always making a table.

How to do proper arrangement of columns having larger image than parent in bootstrap? [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 5 years ago.
Improve this question
I am working on my website development. While creating the portfolio page, I encountered the issue of the last column moving to next row.
I do have images larger than the parent container but I figured it out to display properly, however, after applying the margin the last column went to next row.
Please check the link below:
https://bootsnipp.com/user/snippets/o1e9d
I also wanted to add img-thumbnail class but it does not look proper and adding padding also didn't work as expected.
Please help.
Thank you.
You have added margin: 1px on bootstraps column class which breaks the last column.
Add another div inside gallery_product and apply border/margin to inner div.

Add white space below a table on a page [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
I appreciate that this question has been asked many times but nothing I have looked at has helped me.
Basically, I have a basic table. All I want is to have a bit of white space UNDER the last table (Other Important Pages) but I can't seem to accomplish this.
See here: http://chrisbrighton.co.uk/SiteMap.php
Any suggestions?
Thanks.
Add a bottom margin to the table.
Text Before Table
<table STYLE="margin-bottom: 30px;"><tr><td>Text In Table</td></tr></table>
Text After Table
Add overflow:auto to your #page-container div.
You can add <br /> tags between the tables or add margin-bottom: XXpx to the styling.