WordPress database error: [Table './ay6u3nor6dat6ba1/kn6_ayu1n9k4_5_actionscheduler_actions' is marked as crashed and last (automatic?) repair failed]
SELECT a.action_id FROM kn6_ayu1n9k4_5_actionscheduler_actions a WHERE 1=1 AND a.hook='aioseo_send_usage_data' AND a.status IN ('in-progress') ORDER BY a.scheduled_date_gmt ASC LIMIT 0, 1

WordPress database error: [Table './ay6u3nor6dat6ba1/kn6_ayu1n9k4_5_actionscheduler_actions' is marked as crashed and last (automatic?) repair failed]
SELECT a.action_id FROM kn6_ayu1n9k4_5_actionscheduler_actions a WHERE 1=1 AND a.hook='aioseo_send_usage_data' AND a.status IN ('pending') ORDER BY a.scheduled_date_gmt ASC LIMIT 0, 1

Optional Form Layouts | Loop and Break

Optional Form Layouts

by · May 10, 2014

With a few helper classes, you can dynamically update the layout of your form. Bootstrap comes with a few preset styles to choose from.

Search form

Add .form-search to the <form> tag, and then add .search-query to the <input> for an input box with rounded corners and an inline submit button.

<!DOCTYPE html>
<html>
<head>
<title>Bootstrap Tutorial</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<body>
	<form class="form-search">
		<input type="text" class="input-medium search-query">
		<button type="submit" class="btn">Search</button>
	</form>
</body>
</html>

Untitled

Inline form

To create a form where all of the elements are inline and labels are alongside, add the class .form-inline to the <form> tag. To have the label and the input on the same line, use this inline form code:

<!DOCTYPE html>
<html>
<head>
<title>Bootstrap Tutorial</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<body>
	<form class="form-inline">
		<input type="text" class="input-small" placeholder="Email"> 
		<input type="password" class="input-small" placeholder="Password"> 
		<label class="checkbox"> 
		<input type="checkbox"> Remember me </label>
		<button type="submit" class="btn">Sign in</button>
	</form>
</body>
</html>

Untitled

Horizontal form

Bootstrap also comes with a prebaked horizontal form; this one stands apart from the others not only in the amount of markup, but also in the presentation of the form. Traditionally you’d use a table to get a form layout like the one shown in below example but Bootstrap manages to do it without using tables. Even better, if you’re using the responsive CSS, the horizontal form will automatically adapt to smaller layouts by stacking the controls vertically.

    To create a form that uses the horizontal layout, do the following:

  • Add a class of .form-horizontal to the parent <form> element.
  • Wrap labels and controls in a <div> with class .control-group.
  • Add a class of .control-label to the labels.
  • Wrap any associated controls in a <div> with class .controls for proper alignment.

Example

<!DOCTYPE html>
<html>
<head>
<title>Bootstrap Tutorial</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<body>
	<form class="form-horizontal">
		<div class="control-group">
			<label class="control-label" for="inputEmail">Email</label>
			<div class="controls">
				<input type="text" id="inputEmail" placeholder="Email">
			</div>
		</div>
		<div class="control-group">
			<label class="control-label" for="inputPassword">Password</label>
			<div class="controls">
				<input type="password" id="inputPassword" placeholder="Password">
			</div>
		</div>
		<div class="control-group">
			<div class="controls">
				<label class="checkbox"> <input type="checkbox"> Remember me
				</label>
				<button type="submit" class="btn">Sign in</button>
			</div>
		</div>
	</form>
</body>
</html>

Untitled

Share

You may also like...

Categories