CSS problem

Game development with Board Game Arena Studio
Post Reply
leocheung0725
Posts: 8
Joined: 02 November 2023, 14:12

CSS problem

Post by leocheung0725 »

Hello everyone,

I'm having a problem where the background image I've specified for a div is not displaying. Below are the relevant snippets of my HTML and CSS code:

TPL file:
<div id="board">
</div>
CSS (in tutoricalnovbee.css):

#board {
width: 536px;
height: 528px;
background-image: url('img/board.jpg');
position: relative;
margin: auto;
}
The img directory is located at the root of my website, at the same level as my HTML file. I've tried the following things:

Checked that the file board.jpg exists in the img directory and the path is correct.
Made sure there are no CSS specificity or override issues.
Cleared browser cache and tried different browsers.
User avatar
firgon
Posts: 56
Joined: 14 October 2014, 06:27

Re: CSS problem

Post by firgon »

F12 is your friend!

Inspect your page html.

Is the div really here ?
What does the inspector say about CSS ?
User avatar
Jonathan2004
Posts: 46
Joined: 21 April 2020, 19:06

Re: CSS problem

Post by Jonathan2004 »

You need to double check the name of the image and check that you uploaded it.

This url gives 404
https://studio.boardgamearena.com:8084/ ... /board.jpg

while a known image is reachable (even if I don't have access to it)
https://studio.boardgamearena.com:8084/ ... badges.jpg
leocheung0725
Posts: 8
Joined: 02 November 2023, 14:12

Re: CSS problem

Post by leocheung0725 »

firgon wrote: 30 November 2023, 09:08 F12 is your friend!

Inspect your page html.

Is the div really here ?
What does the inspector say about CSS ?

When I write CSS directly within a <style> tag in the TPL file, it functions correctly. However, once I split the CSS into a separate file, I encounter an issue where the CSS no longer applies.
User avatar
firgon
Posts: 56
Joined: 14 October 2014, 06:27

Re: CSS problem

Post by firgon »

So you have your answer, your css file is wrong (its title, or its location, or... )
Post Reply

Return to “Developers”