HTML: Inline block doesn't work for just one table












1















I'm REALLY new to html, and I'm trying to create a html set of tables, I am using display : inline block and it works the way I want, to put some tables next to the others... but when I put just one table it doesnt shows the borders of the table. The code is the following:






        table {
border: 1px solid black;
border-collapse:collapse;
display: inline-block;
}
h2.headertekst {
text-align: center;
color : white;
font-family: verdana
}

<!DOCTYPE html>
<html>
<head>
<body bgcolor="#3377ff">
<h2 class = "headertekst">Mis Pokemons Favoritos</h2>
<table bgcolor="#e52b50">
<tr>
<th rowspan="4">
<img src="https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/shiny/1.png">
</th>
<td style="color: white">Nombre: Bulbasaur</td>
</tr>
<tr>
<td style="color: white">Peso: 69</td>
</tr>
<tr>
<td style="color: white">Altura: 10</td>
</tr>
<tr>
<td style="color: white">Expreriencia Base: 64</td>
</tr>
</table>
</body>
</html>





and the rest is just the information on the cells










share|improve this question

























  • share complete code, i think some of code is missing

    – Naga Sai A
    Nov 15 '18 at 19:44











  • Please post your full code so we can see the issue.

    – Peter
    Nov 15 '18 at 19:44











  • Just did, thank you guys

    – Mauricio Sanabria Quesada
    Nov 15 '18 at 20:05
















1















I'm REALLY new to html, and I'm trying to create a html set of tables, I am using display : inline block and it works the way I want, to put some tables next to the others... but when I put just one table it doesnt shows the borders of the table. The code is the following:






        table {
border: 1px solid black;
border-collapse:collapse;
display: inline-block;
}
h2.headertekst {
text-align: center;
color : white;
font-family: verdana
}

<!DOCTYPE html>
<html>
<head>
<body bgcolor="#3377ff">
<h2 class = "headertekst">Mis Pokemons Favoritos</h2>
<table bgcolor="#e52b50">
<tr>
<th rowspan="4">
<img src="https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/shiny/1.png">
</th>
<td style="color: white">Nombre: Bulbasaur</td>
</tr>
<tr>
<td style="color: white">Peso: 69</td>
</tr>
<tr>
<td style="color: white">Altura: 10</td>
</tr>
<tr>
<td style="color: white">Expreriencia Base: 64</td>
</tr>
</table>
</body>
</html>





and the rest is just the information on the cells










share|improve this question

























  • share complete code, i think some of code is missing

    – Naga Sai A
    Nov 15 '18 at 19:44











  • Please post your full code so we can see the issue.

    – Peter
    Nov 15 '18 at 19:44











  • Just did, thank you guys

    – Mauricio Sanabria Quesada
    Nov 15 '18 at 20:05














1












1








1








I'm REALLY new to html, and I'm trying to create a html set of tables, I am using display : inline block and it works the way I want, to put some tables next to the others... but when I put just one table it doesnt shows the borders of the table. The code is the following:






        table {
border: 1px solid black;
border-collapse:collapse;
display: inline-block;
}
h2.headertekst {
text-align: center;
color : white;
font-family: verdana
}

<!DOCTYPE html>
<html>
<head>
<body bgcolor="#3377ff">
<h2 class = "headertekst">Mis Pokemons Favoritos</h2>
<table bgcolor="#e52b50">
<tr>
<th rowspan="4">
<img src="https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/shiny/1.png">
</th>
<td style="color: white">Nombre: Bulbasaur</td>
</tr>
<tr>
<td style="color: white">Peso: 69</td>
</tr>
<tr>
<td style="color: white">Altura: 10</td>
</tr>
<tr>
<td style="color: white">Expreriencia Base: 64</td>
</tr>
</table>
</body>
</html>





and the rest is just the information on the cells










share|improve this question
















I'm REALLY new to html, and I'm trying to create a html set of tables, I am using display : inline block and it works the way I want, to put some tables next to the others... but when I put just one table it doesnt shows the borders of the table. The code is the following:






        table {
border: 1px solid black;
border-collapse:collapse;
display: inline-block;
}
h2.headertekst {
text-align: center;
color : white;
font-family: verdana
}

<!DOCTYPE html>
<html>
<head>
<body bgcolor="#3377ff">
<h2 class = "headertekst">Mis Pokemons Favoritos</h2>
<table bgcolor="#e52b50">
<tr>
<th rowspan="4">
<img src="https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/shiny/1.png">
</th>
<td style="color: white">Nombre: Bulbasaur</td>
</tr>
<tr>
<td style="color: white">Peso: 69</td>
</tr>
<tr>
<td style="color: white">Altura: 10</td>
</tr>
<tr>
<td style="color: white">Expreriencia Base: 64</td>
</tr>
</table>
</body>
</html>





and the rest is just the information on the cells






        table {
border: 1px solid black;
border-collapse:collapse;
display: inline-block;
}
h2.headertekst {
text-align: center;
color : white;
font-family: verdana
}

<!DOCTYPE html>
<html>
<head>
<body bgcolor="#3377ff">
<h2 class = "headertekst">Mis Pokemons Favoritos</h2>
<table bgcolor="#e52b50">
<tr>
<th rowspan="4">
<img src="https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/shiny/1.png">
</th>
<td style="color: white">Nombre: Bulbasaur</td>
</tr>
<tr>
<td style="color: white">Peso: 69</td>
</tr>
<tr>
<td style="color: white">Altura: 10</td>
</tr>
<tr>
<td style="color: white">Expreriencia Base: 64</td>
</tr>
</table>
</body>
</html>





        table {
border: 1px solid black;
border-collapse:collapse;
display: inline-block;
}
h2.headertekst {
text-align: center;
color : white;
font-family: verdana
}

<!DOCTYPE html>
<html>
<head>
<body bgcolor="#3377ff">
<h2 class = "headertekst">Mis Pokemons Favoritos</h2>
<table bgcolor="#e52b50">
<tr>
<th rowspan="4">
<img src="https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/shiny/1.png">
</th>
<td style="color: white">Nombre: Bulbasaur</td>
</tr>
<tr>
<td style="color: white">Peso: 69</td>
</tr>
<tr>
<td style="color: white">Altura: 10</td>
</tr>
<tr>
<td style="color: white">Expreriencia Base: 64</td>
</tr>
</table>
</body>
</html>






html display ccss






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Nov 15 '18 at 20:03







Mauricio Sanabria Quesada

















asked Nov 15 '18 at 19:40









Mauricio Sanabria QuesadaMauricio Sanabria Quesada

63




63













  • share complete code, i think some of code is missing

    – Naga Sai A
    Nov 15 '18 at 19:44











  • Please post your full code so we can see the issue.

    – Peter
    Nov 15 '18 at 19:44











  • Just did, thank you guys

    – Mauricio Sanabria Quesada
    Nov 15 '18 at 20:05



















  • share complete code, i think some of code is missing

    – Naga Sai A
    Nov 15 '18 at 19:44











  • Please post your full code so we can see the issue.

    – Peter
    Nov 15 '18 at 19:44











  • Just did, thank you guys

    – Mauricio Sanabria Quesada
    Nov 15 '18 at 20:05

















share complete code, i think some of code is missing

– Naga Sai A
Nov 15 '18 at 19:44





share complete code, i think some of code is missing

– Naga Sai A
Nov 15 '18 at 19:44













Please post your full code so we can see the issue.

– Peter
Nov 15 '18 at 19:44





Please post your full code so we can see the issue.

– Peter
Nov 15 '18 at 19:44













Just did, thank you guys

– Mauricio Sanabria Quesada
Nov 15 '18 at 20:05





Just did, thank you guys

– Mauricio Sanabria Quesada
Nov 15 '18 at 20:05












2 Answers
2






active

oldest

votes


















0














Why are you trying to do it inline? I would suggest using float:right on the tables






share|improve this answer
























  • Because I will add a lot more of tables, so I need them to be ordered. It seems like float:right puts the table on the right part of the page

    – Mauricio Sanabria Quesada
    Nov 15 '18 at 20:01



















0














If you want to add borders inside your tables you have to style td and th elements:



table td, table th {
border: 1px solid black;
}


Or if you need to add only vertical line:



table td, table th { border-left:1px solid black; }





share|improve this answer























    Your Answer






    StackExchange.ifUsing("editor", function () {
    StackExchange.using("externalEditor", function () {
    StackExchange.using("snippets", function () {
    StackExchange.snippets.init();
    });
    });
    }, "code-snippets");

    StackExchange.ready(function() {
    var channelOptions = {
    tags: "".split(" "),
    id: "1"
    };
    initTagRenderer("".split(" "), "".split(" "), channelOptions);

    StackExchange.using("externalEditor", function() {
    // Have to fire editor after snippets, if snippets enabled
    if (StackExchange.settings.snippets.snippetsEnabled) {
    StackExchange.using("snippets", function() {
    createEditor();
    });
    }
    else {
    createEditor();
    }
    });

    function createEditor() {
    StackExchange.prepareEditor({
    heartbeatType: 'answer',
    autoActivateHeartbeat: false,
    convertImagesToLinks: true,
    noModals: true,
    showLowRepImageUploadWarning: true,
    reputationToPostImages: 10,
    bindNavPrevention: true,
    postfix: "",
    imageUploader: {
    brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
    contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
    allowUrls: true
    },
    onDemand: true,
    discardSelector: ".discard-answer"
    ,immediatelyShowMarkdownHelp:true
    });


    }
    });














    draft saved

    draft discarded


















    StackExchange.ready(
    function () {
    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53326824%2fhtml-inline-block-doesnt-work-for-just-one-table%23new-answer', 'question_page');
    }
    );

    Post as a guest















    Required, but never shown

























    2 Answers
    2






    active

    oldest

    votes








    2 Answers
    2






    active

    oldest

    votes









    active

    oldest

    votes






    active

    oldest

    votes









    0














    Why are you trying to do it inline? I would suggest using float:right on the tables






    share|improve this answer
























    • Because I will add a lot more of tables, so I need them to be ordered. It seems like float:right puts the table on the right part of the page

      – Mauricio Sanabria Quesada
      Nov 15 '18 at 20:01
















    0














    Why are you trying to do it inline? I would suggest using float:right on the tables






    share|improve this answer
























    • Because I will add a lot more of tables, so I need them to be ordered. It seems like float:right puts the table on the right part of the page

      – Mauricio Sanabria Quesada
      Nov 15 '18 at 20:01














    0












    0








    0







    Why are you trying to do it inline? I would suggest using float:right on the tables






    share|improve this answer













    Why are you trying to do it inline? I would suggest using float:right on the tables







    share|improve this answer












    share|improve this answer



    share|improve this answer










    answered Nov 15 '18 at 19:45









    glennoxglennox

    1




    1













    • Because I will add a lot more of tables, so I need them to be ordered. It seems like float:right puts the table on the right part of the page

      – Mauricio Sanabria Quesada
      Nov 15 '18 at 20:01



















    • Because I will add a lot more of tables, so I need them to be ordered. It seems like float:right puts the table on the right part of the page

      – Mauricio Sanabria Quesada
      Nov 15 '18 at 20:01

















    Because I will add a lot more of tables, so I need them to be ordered. It seems like float:right puts the table on the right part of the page

    – Mauricio Sanabria Quesada
    Nov 15 '18 at 20:01





    Because I will add a lot more of tables, so I need them to be ordered. It seems like float:right puts the table on the right part of the page

    – Mauricio Sanabria Quesada
    Nov 15 '18 at 20:01













    0














    If you want to add borders inside your tables you have to style td and th elements:



    table td, table th {
    border: 1px solid black;
    }


    Or if you need to add only vertical line:



    table td, table th { border-left:1px solid black; }





    share|improve this answer




























      0














      If you want to add borders inside your tables you have to style td and th elements:



      table td, table th {
      border: 1px solid black;
      }


      Or if you need to add only vertical line:



      table td, table th { border-left:1px solid black; }





      share|improve this answer


























        0












        0








        0







        If you want to add borders inside your tables you have to style td and th elements:



        table td, table th {
        border: 1px solid black;
        }


        Or if you need to add only vertical line:



        table td, table th { border-left:1px solid black; }





        share|improve this answer













        If you want to add borders inside your tables you have to style td and th elements:



        table td, table th {
        border: 1px solid black;
        }


        Or if you need to add only vertical line:



        table td, table th { border-left:1px solid black; }






        share|improve this answer












        share|improve this answer



        share|improve this answer










        answered Nov 15 '18 at 20:25









        Arturs MednisArturs Mednis

        614




        614






























            draft saved

            draft discarded




















































            Thanks for contributing an answer to Stack Overflow!


            • Please be sure to answer the question. Provide details and share your research!

            But avoid



            • Asking for help, clarification, or responding to other answers.

            • Making statements based on opinion; back them up with references or personal experience.


            To learn more, see our tips on writing great answers.




            draft saved


            draft discarded














            StackExchange.ready(
            function () {
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53326824%2fhtml-inline-block-doesnt-work-for-just-one-table%23new-answer', 'question_page');
            }
            );

            Post as a guest















            Required, but never shown





















































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown

































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown







            Popular posts from this blog

            Bressuire

            Vorschmack

            Quarantine