0
die Etiketten sind zu weit weg von den Eingabefelderndie Etiketten sind zu weit weg von den Eingabefeldern
dies für die Benutzer verwirrend sein kann, um zu verfolgen, was sie in füllen.
<link href="http://www.qlbusiness.com/static/ui/semantic.min.css" rel="stylesheet"/>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<title>QL Business</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"
integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<div id="wrapper">
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar"
aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">Customer Service</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<form class="navbar-form navbar-right" enctype="application/x-www-form-urlencoded" action="/account/do_login" method="post">
<div class="form-group">
<input type="text" name="email" placeholder="Email" class="form-control">
</div>
<div class="form-group">
<input type="password" name="password" placeholder="Password" class="form-control">
</div>
<button type="submit" class="btn btn-success">Sign in</button>
</form>
</div>
<!--/.navbar-collapse -->
</div>
</nav>
<!-- Main jumbotron for a primary marketing message or call to action -->
<div class="jumbotron">
<div class="container" style="margin-top:20px; width: 75%">
<div class="ui ignored positive icon message">
<i class="edit icon"></i>
<div class="content">
<h3 class="header">Insert Ad</h3>
Your ad will be reviewed according to the rules of our site. After approval, it will be published
for a period
of 60 days. Thanks for using our site!
</div>
</div>
<form method="post" action="http://www.qlbusiness.com/_ah/upload/AMmfu6ZHOY_ie_HHe69JmSQgOA3W9L3ezf92_z1ZYXubImy_QrcYi0L5bfiv1-nW8nUhxRQBFmdmXkJSEewM0vnauBJ0HjaTJja_s_8KTeg15_fFX8quBGGV91TIBYIK5jtfOe-GXx7E/ALBNUaYAAAAAV3gEGGfIbS9adBDsyVar3DnoppdYi7eu/" name="formular" class="ui form" accept-charset="UTF-8"
enctype="multipart/form-data">
<div class="inline fields">
<div class="required two wide field">
<label>Name</label>
</div>
<div class="five wide field">
<input size="35" type="text" name="name" placeholder="Name">
</div>
</div>
<div class="inline fields">
<div class="required two wide field">
<label>Email</label>
</div>
<div class="five wide field">
<input size="35" type="text" name="email" placeholder="Email">
</div>
</div>
<div class="inline fields">
<div class="two wide field">
<label>Phone</label>
</div>
<div class="five wide field">
<input type="text" placeholder="Phone number">
<div class="ui checkbox">
<input id="example-id" type="checkbox" checked>
<label for="example-id">View phone number on site</label>
</div>
</div>
</div>
<div class="inline fields">
<div class="required two wide field">
<label>Category</label>
</div>
<div class="five wide field">
<select class="ui dropdown" name="category_group">
<option value="0">«All categories»</option>
<option value="1000" style="background-color: rgb(220, 220, 195); font-weight: bold;"
disabled="disabled"
id="cat1000">
-- Real estate --
</option>
<option value="1020" id="cat1020">
Houses
</option>
<option value="1010" id="cat1010">
Apartments
</option>
<option value="1030" id="cat1030">
Vacation homes
</option>
<option value="1050" id="cat1050">
Offices
</option>
<option value="1080" id="cat1080">
Land
</option>
<option value="1100" id="cat1100">
Flatmates/Paying Guest
</option>
<option value="1090" id="cat1090">
Other
</option>
<option value="2000" style="background-color: rgb(220, 220, 195); font-weight: bold;"
disabled="disabled"
id="cat2000">
-- Vehicles --
</option>
<option value="2010" id="cat2010">
Cars
</option>
<option value="2030" id="cat2030">
Motorcycles
</option>
<option value="2040" id="cat2040">
Accessories & parts
</option>
<option value="2080" id="cat2080">
Trucks
</option>
<option value="2070" id="cat2070">
Other vehicles
</option>
<option value="3000" style="background-color: rgb(220, 220, 195); font-weight: bold;"
disabled="disabled"
id="cat3000">
-- Home & Personal items --
</option>
<option value="3040" id="cat3040">
Home & Garden
</option>
<option value="3050" id="cat3050">
Clothing
</option>
<option value="3030" id="cat3030">
For Kids (Toys & Clothes)
</option>
<option value="3060" id="cat3060">
Jewelry & Watches
</option>
<option value="4000" style="background-color: rgb(220, 220, 195); font-weight: bold;"
disabled="disabled"
id="cat4000">
-- Leisure, Sports & hobby --
</option>
<option value="4010" id="cat4010">
Hobbies
</option>
<option value="4020" id="cat4020">
Sports & Bicycles
</option>
<option value="4040" id="cat4040">
Movies, Books & Magazines
</option>
<option value="4030" id="cat4030">
Pets
</option>
<option value="4090" id="cat4090">
Tickets
</option>
<option value="4060" id="cat4060">
Art & Collectibles
</option>
<option value="4070" id="cat4070">
Music & Instruments
</option>
<option value="5000" style="background-color: rgb(220, 220, 195); font-weight: bold;"
disabled="disabled"
id="cat5000">
-- Electronics --
</option>
<option value="5030" id="cat5030">
Computers & Accessories
</option>
<option value="5020" id="cat5020">
TV, Audio, Video, Cameras
</option>
<option value="5010" id="cat5010">
Cellphones & gadgets
</option>
<option value="5040" id="cat5040">
Video games & consoles
</option>
<option value="6000" style="background-color: rgb(220, 220, 195); font-weight: bold;"
disabled="disabled"
id="cat6000">
-- Jobs & Services --
</option>
<option value="6010" id="cat6010">
Job offers
</option>
<option value="6020" id="cat6020">
Resumes
</option>
<option value="6030" id="cat6030">
Services
</option>
<option value="6040" id="cat6040">
Classes
</option>
<option value="6090" id="cat6090">
Professional/Office equipment
</option>
<option value="7000" style="background-color: rgb(220, 220, 195); font-weight: bold;"
disabled="disabled"
id="cat7000">
-- --
</option>
<option value="7010" id="cat7010">
Other
</option>
</select>
</div>
</div>
<div class="inline fields">
<div class="two wide required field">
<label>State</label>
</div>
<div class="five wide field">
<select class="ui dropdown" onchange="cities(this);document.getElementById('area').display='';"
name="region" id="region">
<option value="">«Choose state»</option>
<option value="7089183">
Alabama
</option>
<option value="7091183">
Alaska
</option>
<option value="7088186">
Arizona
</option>
<option value="7102183">
Arkansas
</option>
<option value="7095185">
California
</option>
<option value="7094186">
Colorado
</option>
<option value="7097187">
Connecticut
</option>
<option value="7088187">
Delaware
</option>
<option value="7101184">
Florida
</option>
<option value="7090186">
Georgia
</option>
<option value="7095186">
Hawaii
</option>
<option value="7095187">
Idaho
</option>
<option value="7101185">
Illinois
</option>
<option value="7090187">
Indiana
</option>
<option value="7102184">
Iowa
</option>
<option value="7092184">
Kansas
</option>
<option value="7098186">
Kentucky
</option>
<option value="7100184">
Louisiana
</option>
<option value="7091184">
Maine
</option>
<option value="7089185">
Maryland
</option>
<option value="7096187">
Massachusetts
</option>
<option value="7096188">
Michigan
</option>
<option value="7098188">
Minnesota
</option>
<option value="7102185">
Mississippi
</option>
<option value="7094187">
Missouri
</option>
<option value="7093186">
Montana
</option>
<option value="7091185">
Nebraska
</option>
<option value="7102186">
Nevada
</option>
<option value="7093187">
New Hampshire
</option>
<option value="7090188">
New Jersey
</option>
<option value="7094188">
New Mexico
</option>
<!-- <option value="7099184">-->
<option value="6370570371334144">
New York
</option>
<option value="7101186">
North Carolina
</option>
<option value="7092185">
North Dakota
</option>
<option value="7098189">
Ohio
</option>
<option value="7091186">
Oklahoma
</option>
<option value="7097188">
Oregon
</option>
<option value="7088189">
Pennsylvania
</option>
<option value="7098190">
Rhode Island
</option>
<option value="7093188">
South Carolina
</option>
<option value="7094189">
South Dakota
</option>
<option value="7097189">
Tennessee
</option>
<option value="7101187">
Texas
</option>
<option value="7090189">
Utah
</option>
<option value="7088190">
Vermont
</option>
<option value="7097190">
Virginia
</option>
<option value="7099185">
Washington
</option>
<option value="7091187">
West Virginia
</option>
<option value="7098191">
Wisconsin
</option>
<option value="7101188">
Wyoming
</option>
</select>
</div>
</div>
<div class="inline fields">
<div class="two required wide field">
<label>City</label>
</div>
<div id="cities" class="five wide field">
<select class="ui dropdown" onchange="cities(this);document.getElementById('area').display='';"
name="region" id="region">
<option value="">«Choose city»</option>
</select>
</div>
</div>
<div class="required inline field">
<div class="fields"><label class="two wide field">Type</label>
<div class="inline field">
<input type="radio" name="type" checked="checked">
<label>For sale</label>
</div>
<div class="inline field">
<input type="radio" name="type">
<label>Want to buy</label>
</div>
</div>
</div>
<div class="inline fields">
<div class="required two wide field">
<label>Title</label>
</div>
<div class="five wide field">
<input size="55" type="text" name="title" placeholder="Title">
</div>
</div>
<div class="inline fields">
<div class="required two wide field">
<label>Text</label>
</div>
<div class="five wide field">
<textarea name="text"></textarea>
</div>
</div>
<div class="inline fields">
<div class="required two wide field">
<label>Price</label>
</div>
<div class="five wide field">
<div class="ui right labeled input">
<div class="ui label">
$</div>
<input type="text" placeholder="Amount">
<div class="ui basic label">
.00
</div>
</div>
</div>
</div>
<div class="inline field">
<label class="two wide field">Image</label>
<input name="image1" size="35" id="image1" type="file">
</div>
<div class="inline field">
<label class="two wide field">Image</label>
<input name="image2a" size="35" id="image2a" type="file">
</div>
<div class="inline field">
<label class="two wide field">Image</label>
<input name="image3" size="35" id="image3" type="file">
</div>
<div class="inline field">
<label class="two wide field">Image</label>
<input name="image4" size="35" id="image4" type="file">
</div>
<div class="inline field">
<label class="two wide field">Image</label>
<input name="image5" size="35" id="image5" type="file">
</div>
<div class="required field">
<div class="ui checkbox">
<input id="terms" type="checkbox" checked>
<label for="terms">I agree to the Terms and Conditions</label>
</div>
</div>
<div class="inline field">
<label class="two wide field"></label>
<div class="ui progress blue seven wide field">
<div class="bar"></div>
<div class="percent">0%</div>
</div>
<div id="status"></div>
</div>
<br>
<div class="ui field">
<input type="submit" value="Submit" class="ui button"/>
</div>
<div class="ui error message"></div>
</form>
<footer>
<p>© 2016 QL Business, Inc.</p>
<a href="https://www.facebook.com/koolbusiness" target="_blank">
<button class="ui circular facebook button">
<i class="facebook icon"></i>
Facebook
</button></a>
<!--
<button class="ui twitter button">
<i class="twitter icon"></i>
Twitter
</button>-->
<a href="https://plus.google.com/b/101588786083596465725/101588786083596465725" target="_blank">
<button class="ui circular google plus button">
<i class="google plus icon"></i>
Google Plus
</button>
</a>
</footer>
</div>
</div>
<hr>
</div>Wie kann ich abnehmen, den Abstand zwischen den Etiketten und den Eingabefeldern?
Sie müssen breit ändern auf der linken Felder zu verengen. Die divs, in denen Sie die Beschriftungen haben. Suchen Sie eine Google-Suche nach Bootstrap-Gitter – hesonline
Es hat nicht funktioniert. Ich weiß nicht warum. Ich versuche stattdessen Gitter mit Semantik-Ui zu machen. Zu schmal zu werden, tut nichts oder fast nichts für mich. –