View Single Post
Old 09-05-2018, 10:28 PM   #24
Turtle91
A Hairy Wizard
Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.
 
Turtle91's Avatar
 
Posts: 3,363
Karma: 20212733
Join Date: Dec 2012
Location: Charleston, SC today
Device: iPhone 15/11/X/6/iPad 1,2,Air & Air Pro/Surface Pro/Kindle PW & Fire
If you have a device that supports nth-child selectors you can make this reeeally easily...


Spoiler:

Code:
<!DOCTYPE html>
<html>
<head>
<title>Chess Board</title>

<style>
table {border-collapse:collapse; border:1px solid black; width:80px}
tr  {padding:0; height:10px}
td  {padding:0; width:10px; background-color:white}
img {width:10px}  */ with Square image /*

tr:nth-child(odd) td:nth-child(even) {background-color:black}
tr:nth-child(even) td:nth-child(odd) {background-color:black}
</style>

</head>
<body>

<table>
<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td><img src="bk2.jpg" alt=""/></td></tr>
<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><td><img src="wk2.jpg" alt=""/></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
</table>

</body>
</html>


If you don't, then you can use your technique, but make sure you have the proper quotation marks around the src="pieces/b.jpg" alt="" (you don't need alt=cp).

You can get rid of any styling in the table itself. Simply give it a class and then put the proper (to your taste) styling in the linked stylesheet. See example for possible css.

Cheers,


edit: I think your extra lines came from the spaces (line breaks) you had between the <img> tags.
Attached Thumbnails
Click image for larger version

Name:	chess.JPG
Views:	265
Size:	100.1 KB
ID:	166084  

Last edited by Turtle91; 09-05-2018 at 10:37 PM.
Turtle91 is offline   Reply With Quote