I have a Bootstrap image slider in my project, I only need the bootstrap js and css file for that slider. Everything works fine till I publish my site online. Then the imageslider is nowhere, the images aren't shown, just a white space.
I included jquery and popper because I read that is necessary but still it does not work. Why is that?
<script src="https://code.jquery.com/jquery-3.6.3.js" integrity="sha256-nQLuAZGRRcILA+6dMBOvcRh5Pe310sBpanc6+QBmyVM=" crossorigin="anonymous"></script>
<script defer src="./scripts/popper.min.js"></script>
<link href="./styles/bootstrap.min.css" type="text/css" rel="stylesheet" />
<link href="./styles/reset.css" type="text/css" rel="stylesheet" />
<link href="./styles/allstyles.css" type="text/css" rel="stylesheet" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/all.min.css">
<link rel="shortcut icon" href="./img/huisstijl/logo.png" type="image/x-icon">
<script src="./scripts/bootstrap.bundle.min.js"></script>
Related
My static website has broken css and possibly js over https only. http works fine.
I know the issues of loading mixed content, however most of my style sheets are relative.
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css" type="text/css">
<link rel="stylesheet" href="assets/css/style.css">
<link rel="stylesheet" href="assets/css/owl.carousel.min.css">
<link rel="stylesheet" href="assets/css/magnific-popup.css">
<link rel="stylesheet" href="assets/font-awesome/css/fontawesome-all.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:400,500,600">
What could be the issue?
I have a codeigniter application where I am trying to implement the design I have currently implemented the design but some of the functionality is not working due to the sass not getting called I was wondering if anyone knows where I should be placing the sass folder and or if I should be altering the css files to call the sass.
Any help would be appreciated, thanks
My call to the css is as follows:
<link href="<?=base_url()?>public/assets/global/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<link href="<?=base_url()?>public/assets/global/plugins/simple-line-icons/simple-line-icons.min.css" rel="stylesheet" type="text/css" />
<link href="<?=base_url()?>public/assets/global/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="<?=base_url()?>public/assets/global/plugins/uniform/css/uniform.default.css" rel="stylesheet" type="text/css" />
<link href="<?=base_url()?>public/assets/global/plugins/bootstrap-switch/css/bootstrap-switch.min.css" rel="stylesheet" type="text/css" />
<!-- END GLOBAL MANDATORY STYLES -->
<!-- BEGIN PAGE LEVEL PLUGINS -->
<link href="<?=base_url()?>public/assets/global/plugins/bootstrap-daterangepicker/daterangepicker.min.css" rel="stylesheet" type="text/css" />
<link href="<?=base_url()?>public/assets/global/plugins/morris/morris.css" rel="stylesheet" type="text/css" />
<link href="<?=base_url()?>public/assets/global/plugins/fullcalendar/fullcalendar.min.css" rel="stylesheet" type="text/css" />
<link href="<?=base_url()?>public/assets/global/plugins/jqvmap/jqvmap/jqvmap.css" rel="stylesheet" type="text/css" />
<!-- END PAGE LEVEL PLUGINS -->
<!-- BEGIN THEME GLOBAL STYLES -->
<link href="<?=base_url()?>public/assets/global/css/components-md.min.css" rel="stylesheet" id="style_components" type="text/css" />
<link href="<?=base_url()?>public/assets/global/css/plugins-md.min.css" rel="stylesheet" type="text/css" />
<!-- END THEME GLOBAL STYLES -->
<!-- BEGIN THEME LAYOUT STYLES -->
<link href="<?=base_url()?>public/assets/layouts/layout4/css/layout.min.css" rel="stylesheet" type="text/css" />
<link href="<?=base_url()?>public/assets/layouts/layout4/css/themes/light.min.css" rel="stylesheet" type="text/css" id="style_color" />
<link href="<?=base_url()?>public/assets/layouts/layout4/css/custom.min.css" rel="stylesheet" type=
I also have the sass just placed in the public/assets folder.
Your application should not be calling the SASS file. Instead app should call the CSS - compiled from the SASS.
I was wondering if anyone knows where I should be placing the sass
folder and or if I should be altering the css files to call the sass.
You can actually place it on any folder and when compiled will be placed in your assets folder.
I made a website with a favicon that was working a few days ago. Now, it is only working on my localhost. It's not appearing online. What could be the problem? I uploaded the favicon to public_html.
<link href="view/css/bootstrap.min.css" rel="stylesheet">
<link href="view/css/styles.css" rel="stylesheet">
<link href="http://fonts.googleapis.com/css?family=Archivo+Narrow" rel="stylesheet" type="text/css">
<link rel='shortcut icon' type='image/x-icon' href='favicon.ico' />
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="js/respond.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
Just started using font-awesome and all my images appear as squares if I use the font-awesome css locally. My code is straightforward:
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="moment.js"></script>
<script type="text/javascript" src="daterangepicker.js"></script>
<link rel="stylesheet" type="text/css" href="bootstrap.css" />
<link rel="stylesheet" type="text/css" href="daterangepicker-bs3.css" />
<link rel="stylesheet" type="text/css" href="font-awesome.css"/>
</head>
<i class="fa fa-truck"></i>truck
I put the font files in ../fonts/ as it says in the font-awesome.css. I also put the fa which is particular to version 4.0, and I also tried the CDN. However, with the CDN, I don't even get a square, I just get a blank. Anyone have any idea?
Thanks!
My textbox renders very differently on IE and Chrome
IE
Chrome
You can see that width of textbox is small in IE.
My html is defined as
<input id="Name" data-bind ="value:Name" style="width: 210px"/>
I tried downloading normalize.css and included at top of my scripts , but still it renders incorrectly on different browsers.
I am sure there would be more input required, so do let me know what you guys need to resolve my issue.
These are the scripts i am using
<link href="css/normalize.css" rel="stylesheet" />
<script src="../Myfolder/External/jQuery/jquery-1.7.2.js"></script>
<link href="../Myfolder/External/jQuery UI/css/smoothness/jquery-ui-1.8.20.custom.css" rel="stylesheet" />
<script src="../Myfolder/External/jQuery UI/js/jquery-ui-1.8.20.custom.min.js"></script>
<link href="../Myfolder/Styling/common.css" rel="stylesheet" />
<script src="../Myfolder/External/Knockout/knockout-2.2.0.js"></script>
<script src="../Myfolder/External/JSON/json2.min.js"></script>
<script src="../Myfolder/External/Knockout/Plugins/koExternalTemplateEngine_all.min.js"></script>
<script src="../Myfolder/External/Knockout/Plugins/knockout.validation.js"></script>
<script src="../Myfolder/External/Knockout/Plugins/knockout.mapping-latest.js"></script>
<link href="../Myfolder/External/Kendo/styles/kendo.common.min.css" rel="stylesheet" />
<link href="../Myfolder/External/Kendo/styles/kendo.default.min.css" rel="stylesheet" />
<link href="../Myfolder/External/Bootstrap/css/bootstrap.css" rel="stylesheet" />
<link href="../Myfolder/External/Bootstrap/css/responsive.css" rel="stylesheet" />
<script src="../Myfolder/External/Bootstrap/js/bootstrap.js"></script>
<script src="../Myfolder/External/Kendo/kendo.web.min.js"></script>
<script src="../NewUI2013/AgrOD/external/amplify/amplify.min.js"></script>
<script src="../Myfolder/External/Knockout/Plugins/knockout-kendo.min.js"></script>
<script src="../Myfolder/External/Knockout/knockout.dirtyFlag.js"></script>
<script src="../Myfolder/Custom/customKO.js"></script>
<script src="../Myfolder/Custom/custom.js"></script>
Set height:25px or any other value should solve the issue. The problem most likely that since you used so many css files of external source, the browser maybe misinterpreting some of them.