0

Yes there's a billion posts on this topic and this is ironic because I've centered many tables before..
But the "answer" is not working. I am using a Database.net plug in table (which could be why?) Link to Codepen: https://codepen.io/ScottFSchmidt/pen/eemrBG

Also, I want to be able to maintain like a 80%+ width. On "solution" worked but then the table was small because it had 50% width. 

table {
    width:100%;
    margin: 0 auto;
}

.table {
    border-radius: 5px;
    margin: 0px auto;
    float: none;
    width:100%;
    margin: 0 auto;
}

This is bootstrap 3 FYI not 4 so it’s not a duplicate

Ivanka Todorova
  • 9,964
  • 16
  • 66
  • 103
  • update you code and add you html code too – ScaisEdge Oct 30 '17 at 17:32
  • Can you please try, in css. table { padding: 0 20%;} I have modified your codepen. – Abhilash KK Oct 30 '17 at 17:36
  • It might be because I didn’t clear my cache because it looks centered on my phone but hard to tell. Is it center for anyone else? I’m at lunch –  Oct 30 '17 at 17:36
  • This table is bootstrap 3 not 4 from what I remember... –  Oct 30 '17 at 17:38
  • You are using [Bootstrap 4's style sheet](https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css). In any case, the solution of moving `.table-responsive` to the container [seems to work for me](https://codepen.io/anon/pen/POwdJw). – showdev Oct 30 '17 at 17:43
  • I don't see what the problem is. Table is easily centered. – akinuri Oct 30 '17 at 17:56
  • Ok. Thanks I’ll move it to the doc. In the link it says bootstrap 3.5 or something. I got it from the cdn website. Why they put 3.5 if it’s 4? Confusing –  Oct 30 '17 at 17:57
  • Table is centered now. 20% padding as someone suggested seemed to work –  Oct 30 '17 at 17:59
  • From what I see in your CodePen, you're using Bootstrap 3.3.5 JavaScript and Bootstrap 4.0.0-beta.2 CSS. – showdev Oct 30 '17 at 17:59
  • Yeah you’re right I didn’t check my links I imported code from a previous project. I deleted bootstrap 4 good catch. –  Oct 30 '17 at 18:04

1 Answers1

0

Answer: 

  padding-left:20%;
  padding-right:20%;

Also, Bootstrap 4 does not allow 100% width.

Thanks to all who commented!