Skip to content Skip to sidebar Skip to footer
Home / Css / Html / Javascript

How To Fix Coloumn Size During Search Method In Html?

Post a Comment
I am implementing a search and on that search results come. BUT WHEN the organization name becomes big. The alignment completely changes. How can I able to fix the same.

Solution 1:

bootstrap 4 autommatically solves the issue for you, see the code below, it will solve the issue for you.

<!DOCTYPE html><html><head><linkrel="stylesheet"href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css"integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb"crossorigin="anonymous"><linkrel="stylesheet"href="style.css" /><scriptsrc="script.js"></script></head><body><divclass="row"><divclass="col-sm-2 mt-2"><divclass="bg-primary">qweqweqw eqweq weqweqwq</div></div><divclass="col-sm-2 mt-2"><divclass="bg-primary">qweqweq</div></div><divclass="col-sm-2 mt-2"><divclass="bg-primary">qweq weqweqwe</div></div><divclass="col-sm-2 mt-2"><divclass="bg-primary">qweqwe </div></div><divclass="col-sm-2 mt-2"><divclass="bg-primary">qweq</div></div><divclass="col-sm-2 mt-2"><divclass="bg-primary">qweqwe qwe</div></div><divclass="col-sm-2 mt-2"><divclass="bg-primary">qweqwe</div></div><divclass="col-sm-2 mt-2"><divclass="bg-primary">qwe asdasd</div></div><divclass="col-sm-2 mt-2"><divclass="bg-primary">asda qweqwe</div></div><divclass="col-sm-2 mt-2"><divclass="bg-primary">asd adasd asdasdasd aadasdasd asdasd </div></div><divclass="col-sm-2 mt-2"><divclass="bg-primary">asdasd asdasd</div></div><divclass="col-sm-2 mt-2"><divclass="bg-primary">ad</div></div><divclass="col-sm-2 mt-2"><divclass="bg-primary">asdasd</div></div><divclass="col-sm-2 mt-2"><divclass="bg-primary">zxczxczxc</div></div></div></body></html>

Solution 2:

You can truncate post.bussinessName or you can try this in your css:

.proerty-item {
  min-height: 330px;
}

Post a Comment for "How To Fix Coloumn Size During Search Method In Html?"