[SOLVED] Bootstrap html

FiveM Resource Development & Modding Discussion
1

Hello,

I’m new on five M community and I would like to know why my bootstrap isn’t working.

I have in __resource.lua

ui_page "html/index.html"

client_script "main.lua"

files {
    "html/index.html",
    "html/style.css",
    "html/css/bootstrap-grid.min.css",
    "html/css/bootstrap-reboot.min.css",
    "html/css/bootstrap.min.css",
    "html/js/bootstrap.bundle.min.js",
    "html/js/bootstrap.min.js"
}

and on my index.html file i have this, I deleted some parts of html just to make the thing more clear

<link rel="stylesheet" href="./css/bootstrap-grid.min.css" type="text/css">
<link rel="stylesheet" href="./css/bootstrap-reboot.min.css" type="text/css">
<link rel="stylesheet" href="./css/bootstrap.min.css" type="text/css">
<script src="./js/bootstrap.bundle.min.js" type="text/javascript"></script>
<script src="./js/bootstrap.min.js" type="text/javascript"></script>


<div id="container">
<div class="input-group mb-3">
	<div class="input-group-prepend">
		<span class="input-group-text" id="basic-addon1">@</span>
	</div>
	<input type="text" class="form-control" placeholder="Username" aria-label="Username" aria-describedby="basic-addon1">
</div>
</div>

My input : Capture

Expected (bootstrap example):

Capturess
Capturess842×73 802 Bytes

Thanks for your help

1 Like
2

It looks like css issues

3

There is something that I’m doing wrong maybe, i guess

4

try to remove the ./ before the css, it may not be necessary to show that it is in the same dir

5

I did this, it didn’t work too. I tried with CDN it worked well, i don’t know what is the problem

<link rel="stylesheet" href="css/bootstrap-grid.min.css" type="text/css">
<link rel="stylesheet" href="css/bootstrap-reboot.min.css" type="text/css">
<link rel="stylesheet" href="css/bootstrap.min.css" type="text/css">
<script src="js/bootstrap.bundle.min.js" type="text/javascript"></script>
<script src="js/bootstrap.min.js" type="text/javascript"></script>
6

change that bootstrap-grid.min.css for that bootstrap-grid-min.css

7

Capture

Tried with bootstrap-grid-min.css, didn’t work.

By the way thanks for the help

1 Like
9

Okk finally it worked.
For those who have the same problem, i just cleared the cache of the server and just relaunched it.

1 Like
10

Thank you for sharing the solution.

11

No problem !