So, in my continuing journey, I've been learning CSS.
And I've hit a roadblock that's got me stuck, even though it seems
SUPER simple.
How do I create a table that uses a jpg image as a background, using CSS?
I've been working on this for about a week with W3 schools tutorials, and I
just can't get it to work on my own pages. I can do their tutorials fine, but
when I switch it across to a real world application, something is different
and I don't understand what, because either the table doesn't show up, or
it does, but with no background.
If anybody can help or point me at an alternate tutorial I'd be much appreciative.
Thank you!
Enclose the table in a div and set it's background properties instead.
If you're not familiar with wrapping it up in DIV like zeno suggest, then this probably can help you:
http://www.htmliseasy.com/table_tutor/background.html
You can set the background for the whole table, or per column. And of course you can port it to CSS styles.
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.giveYourOwnNameHere {background: #aaf url('https://www.google.com/images/srpr/logo11w.png') center no-repeat;}
</style>
</head>
<body>
<table class="giveYourOwnNameHere" border="1">
<tr><th>Header 1</th><th>Header 2</th><th>Header 3</th><th>Header 4</th><th>Header 5</th></tr>
<tr><td>Row:1 Cell:1</td><td>Row:1 Cell:2</td><td>Row:1 Cell:3</td><td>Row:1 Cell:4</td><td>Row:1 Cell:5</td></tr>
<tr><td>Row:2 Cell:1</td><td>Row:2 Cell:2</td><td>Row:2 Cell:3</td><td>Row:2 Cell:4</td><td>Row:2 Cell:5</td></tr>
<tr><td>Row:3 Cell:1</td><td>Row:3 Cell:2</td><td>Row:3 Cell:3</td><td>Row:3 Cell:4</td><td>Row:3 Cell:5</td></tr>
<tr><td>Row:4 Cell:1</td><td>Row:4 Cell:2</td><td>Row:4 Cell:3</td><td>Row:4 Cell:4</td><td>Row:4 Cell:5</td></tr>
<tr><td>Row:5 Cell:1</td><td>Row:5 Cell:2</td><td>Row:5 Cell:3</td><td>Row:5 Cell:4</td><td>Row:5 Cell:5</td></tr>
<tr><td>Row:6 Cell:1</td><td>Row:6 Cell:2</td><td>Row:6 Cell:3</td><td>Row:6 Cell:4</td><td>Row:6 Cell:5</td></tr>
</table>
</body>
</html>
Both of these are deliciously useful. Many many thanks.
I solved it short term by using Landing Page Genie, but I'm VERY aware
relying on a tool will mean I come unstuck at some point.
Thank you, kind sirs.