CODEWITHSUNDEEP
cssresizehtml-table
Math chiller
Math chiller

Reputation: 4167

table cells and rows are auto-resizing

im building a minesweeper game, and i included a 10*10 table. i programmed it so that when a user clicks a "td", it displays either nothing, or a "b", or a number 1-4. however it also resizes (shrinks) when it does so, how do i prevent it from doing this?

css for table

table{
border-collapse: collapse;
border-spacing: 0px;
border: 4px inset #444;
}

css for td

td {
margin: 0px;    
}

css before clicking

.box{
border: 3px outset #959595;
width:25px;
height: 25px;
}

this css is for a bomb ("b"), nothing, and numbers.(the difference with those is color)

.bomb{
border: 1px dotted #000000;
width:25px;
height: 25px;
}

heres a link if that helps

Upvotes: 0

Views: 437

Answers (2)

DevlshOne
DevlshOne

Reputation: 8457

Use a developer's tool to very carefully measure out your box-models. You should be using some padding inside the <td> so that the borders do not overwrite or coincide with the table. My suggestion would be to use display:block on possible <td> contents and set the border so that it appears within the actual grid lines of the table.

Upvotes: 1

sheplu
sheplu

Reputation: 2975

what is the css after clicking? i think it's resize because of border with diffrent value

Upvotes: 1

Related Questions