This question already has answers here:
What's the thing with empty script tags in HTML? [duplicate]
(2 answers)
Closed 2 years ago.
Hello when I remove the text in head
<link rel="stylesheet" src="index.CSS">
<script SRC="index.is">
The form appear but when I enter the text the form dissapear
Even tho the CSS and js files are all empty I haven't writer anything
Code
:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Organic Pe sign up</title>
<link rel="stylesheet" src="index.css">
<script src="index.js">
</head>
<body>
<section>
<div class="bix">
<div class="form">
<h2>Sign Up</h2>
<form>
<div class="uc">
<input type="text" placeholder="Username"></input>
<img src="user.png"></img>
</div>
<div class="uc">
<input type="text" placeholder="Password"></input>
<img src="lock.png"></img>
</div>
<label class="remember"><input type="Checkbox">Remember Me</input></label>
</form>
</div>
</div>
</section>
</body>
</html>
You forgot to close the <script> tag. Replace the following:
<script src="index.js">
With this:
<script src="index.js"></script>
Related
In the dialog box that I have created for my google sheet, the text appears above the user input box. I want the text to appear, besides the user input box. Attached are the HTML and what the dialog box currently looks like. Would this be done through CSS or a different way?
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
</head>
<body>
<div>
<table>
<h5>LA/LB</h5>
<div>
<input type="text" class="form-control" id="alertLocation">
</div>
</table>
</div>
</body>
</html>
Try it like this:
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
</head>
<body>
<div>
<input type="text" class="form-control" id="alertLocation" /><label for="alertLocation">LA/LB</label>
</div>
</body>
</html>
label
I am a newcomer to html and web development.
Recently I want to create my website and on one of the pages I want it have a form.
I use pageclip and followed instructions from it.
The site is on: wcyat.me/pageclip
code:
<!DOCTYPE html>
<html lang="en-US">
<head>
<link href="https://s.pageclip.co/v1/pageclip.css" rel="stylesheet" type="text/css" media="screen">
</head>
<body>
<form action="https://send.pageclip.co/p4eaPA68eOwq8IiuoAfyxqPcXirFGmfr/contact-form" class="pageclip-form" method="post">
<!-- Replace these inputs with your own. Make sure they have a "name" attribute! -->
<!-- It looks like you are creating a contact form. These email and subject fields are special -->
<!-- See https://pageclip.co/docs#special-fields for more info -->
<input type="email" name="email" value="roscoe#example.com" />
<input type="text" name="subject" value="A contact subject" />
<!-- This button will have a loading spinner. Keep the inner span for best results. -->
<button type="submit" class="pageclip-form__submit">
<span>Send</span>
</button>
</form>
<script src="https://s.pageclip.co/v1/pageclip.js" charset="utf-8"></script>
</body>
<footer class="site-footer">
<center>
<div id="footer">
<img src="https://simpleanalyticsbadge.com/wcyat.me" loading="lazy" referrerpolicy="no-referrer" crossorigin="anonymous" />
<img alt="github" src="https://raw.githubusercontent.com/wcyat/wcyat.github.io/main/images/GitHub-Mark.png"width=50" height="46.06">
<img alt="telegram" src="https://raw.githubusercontent.com/wcyat/wcyat.github.io/main/images/Logo.svg"width=40" height=40">
</div>
</center>
</footer>
</html>
I don't know whether it's my problem or not because I don't really know a lot about web development.
Hi Guys I have a problem about bootstrap bootstrap.min.css jquery.min.js and bootstrap.min.js are already included in my project but I cannot use well well-sm class and when I add manually by links this time divs engage you can see in the picture. where is the problem I don't understand?
my code :
#model xx.Web.Models.MiniRepairViewModel
#{
Layout = null;
}
<div class="pageWrapper">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
#Html.Action("Breadcrumb", "Manage")
<div class="TextBody">
<div class="container">
#Html.Action("LeftMenu", "Manage") //menu engage
<div class="col-threeQuarters">
#using (Ajax.BeginForm("MiniRepairServiceAdd", "Ajax", new AjaxOptions { OnSuccess = "jsFilt", OnFailure = "OnFailure" }))
{
<ul class="Form">
<li class="oneColumsFull">
#Html.DropDownListFor(x => x.GetCityModel.a, (IEnumerable<SelectListItem>)ViewBag.CitiesList, "select", new { name = "x", id = "y" })
</li>
<li id="ilce" class="twoColumsFull" style="display:none;">
</li>
<li class="oneColums"><input type="text" name="serviceName" id="serviceName" placeholder="Service"></li>
<li class="button"><input class=".bh-sl-reset" id="reset" type="button" value="clear" onclick="javascript: window.location.reload();"></li>
<li class="button"><input type="submit" value="search" name="search"></li>
</ul>
}
<div id="myDiv" class="well well-sm"> </div> //not working
</div>
</div>
</div>
</div>
I am not sure if colThreeQuarters is a bootstrap class, the actual class is col
<div class="container">
<div class="row">
<div class="col-md-9> // 3quarters
</div>
</div>
</div>
You Need to include headtag before Bodytag and add the bootstrap cdn in that head and write you js cdn at bottom of body tag.
SO the code structure will be like this
<html>
<head>
<bootstrap cdn>
</head>
<body>
your content
...
..
<js cdns>
</body>
</html>
This is because you are not loading your bootstrap cdn at right place. You should load all your scripts files inside your head tag as #yashwardhan said.
this mean:
Go to your code, find </head> tag and load all your scripts and css file just before this tag.
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
</head>
and use the right bootstrap syntax. colThreeQuarters is not a bootstrap class
Why you should do this, is explained here:-
Where should I put <script> tags in HTML markup?
How can I change position of where the calendar pops up. I am using the below code and the calendar pops up to the far left.
I need it to pop up over the input field.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Title</title>
<!-- jQuery -->
<script src="../datepicker/jquery-3.1.1.min.js" type='text/javascript'>
</script>
<!-- Bootstrap -->
<link href="../css/bootstrap.min.css" type="text/css">
<link href='../datepicker/bootstrap/css' rel='stylesheet'
type='text/css'>
<script src=../datepicker/bootstrap/js/bootstrap.min.js
type='text/javascript'></script>
<!-- Datepicker -->
<link href='../datepicker/bootstrap-datepicker/dist/css/bootstrap-
datepicker.min.css' rel='stylesheet' type='text/css'>
<script src='../datepicker/bootstrap-datepicker/dist/js/bootstrap-
datepicker.min.js' type='text/javascript'></script>
</head>
<body>
<div class="container">
<div align="center">
<h4>Date Range for Chart</h4>
<form method="post" action="mychart2.php">
<p>Start Date: <input type="text" name = "start" data-provide="datepicker"
data-date-format="yyyy-mm-dd"></p>
<p>End Date: <input type="text" name = "end" data-provide="datepicker"
data-date-format="yyyy-mm-dd"></p>
<br>
<input type="submit" name="submit" value="Submit">
</form>
</div>
</div>
</body>
</html>
I not sure I can control the position by using data-provide
First, make sure that you use the Bootstrap CSS. It seems that the Bootstrap is not loaded properly.
You can set the HTML property data-date-orientation according to the documentation:
A space-separated string consisting of one or two of “left” or “right”, “top” or “bottom”, and “auto” (may be omitted); for example, “top left”, “bottom” (horizontal orientation will default to “auto”), “right” (vertical orientation will default to “auto”), “auto top”. Allows for fixed placement of the picker popup.
Each option attribute has to have the data-date- prefix.
The distance to the input field may be controller by setting the margin.
I need to position a textfield and a button side by side always.The logic is something like this-The button will always be in the right side of the screen.The textfield should occupy the rest of the width in the left side.I tried giving a specific % width for the textfield.But I have to support both android and iOS devices.So there is a problem of varying screen sizes among them and that solution did not work well with all the screen sizes.This is the code I have used
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="content">
<div style="display:inline;">
<input type="text" placeholder="Enter your user name"></input>
Check
</div>
</div>
</div>
</body>
</html>
Demo here - http://jsfiddle.net/d7T4E/
I am not sure but you can try with this:
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="content">
<div style="display:inline;">
<input type="text" style="width:50% !important; float:left;" placeholder="Enter your user name"></input>Check
</div>
</div>
</div>
</body>
</html>