CODEWITHSUNDEEP
htmlbootstrap-4
Undry
Undry

Reputation: 447

Bootstrap table split cells

I have the following strange thing happening. I have the following table:

<table border="1" cellpadding="1" cellspacing="1" class="table">
<tbody>
    <tr>
        <td colspan="2">Паша</td>
    </tr>
    <tr>
        <td>Паша</td>
        <td>Паша 2</td>
    </tr>
</tbody>

It works fine as long as I don't add the boostrap table class. Without class it looks like this:

enter image description here

But as soon as I add the bootstrap table class, it looks like this

<table border="1" cellpadding="1" cellspacing="1" class="table">
<tbody>
    <tr>
        <td colspan="2">Паша</td>
    </tr>
    <tr>
        <td>Паша</td>
        <td>Паша 2</td>
    </tr>
</tbody>

enter image description here

Any idea what is happening here?

P.S. Sorry can't see pictures in my country (maybe some block?). Adding theese for reference.

Pics not showing properly here are the links Without boostrap - https://ikeen.com/img/blog/t1.jpg With bootstrap - https://ikeen.com/img/blog/t2.jpg

Upvotes: 1

Views: 135

Answers (2)

BK94
BK94

Reputation: 79

I cannot figure out what is the exact reason for that strange behavior. Perhaps, It might be the problem with the bootstrap version that you set up locally. Try to update it or use CDN. You can find them at https://getbootstrap.com/docs/4.6/getting-started/download/

I used bootstrap 4.6.0 as below and it worked fine.

<head>
   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
</head>
<body>
   <table class="table table-bordered">
      <tbody>
         <tr>
            <td colspan="2">Паша</td>
         </tr>
         <tr>
            <td>Паша</td>
            <td>Паша 2</td>
         </tr>
      </tbody>
   </table>        
</body>

Upvotes: 1

Undry
Undry

Reputation: 447

I don't know how and why but this seems to work. I think there is a problem with tag in bootstrap

<table class="table table-hover">
<tbody>
    <tr>
    </tr>
</tbody>
<tbody>
    <tr>
        <td colspan="2">Безлимитный интернет на скорости 40 Мбит в секунду</td>
    </tr>
    <tr>
        <td>Всего за 4500 тенге в месяц</td>
        <td>Оборудование в подарок</td>
    </tr>
</tbody>

Upvotes: 0

Related Questions