Diskuze: CSS a bootstrap pozice

Naučíme tě pracovat na home-office.

Zjistit více...

Aktivity

Štěpán Karlovec

Člen

Štěpán Karlovec:19.5.2018 19:37

Ahoj, v bootstrapu jsem nový ale když v css pozicuji a potom zmenším stránku musím posouvat tím barem.
nevíte jak to smrsknout všechno pod sebe aby to bylo i pro mobilní verze?

Odpovědět

19.5.2018 19:37

xpoproci

Člen

xpoproci:19.5.2018 19:45

z obrázka css a html nevyčítame.

Nahoru Odpovědět

19.5.2018 19:45

Motto

Štěpán Karlovec

Člen

Štěpán Karlovec:19.5.2018 20:07

<body>
<div class="container">
<h1 style="color: white;">Registrace</h1>
</div>

<form class="container">
<div class="form-group">
<label style="color: white;" for="jmenoid">Jméno:</label>
<input type="text" class="form-control" style="width: 40%;" name="jmeno" id="jmenoid" placeholder="Jméno">
</div>
<div class="form-group">
<label style="color: white;" for="emailid">Email</label>
<input type="email" class="form-control" style="width: 40%;" name="email" id="emailid" placeholder="Email">
</div>
<div class="form-group">
<label style="color: white;" for="nickid">Nick ve hře</label>
<input type="text" class="form-control" style="width: 40%;" name="nick" id="nickid" placeholder="Nick ve hře">
</div>
<div class="form-group">
<label style="color: white;" for="hesloid">Heslo</label>
<input type="password" class="form-control" style="width: 40%;" name="heslo" id="hesloid" placeholder="Heslo">
</div>
<div class="form-group">
<label style="color: white;" for="hesloznovuid">Znovu heslo</label>
<input type="password" class="form-control" style="width: 40%;" name="hesloznovu" id="znovuhesloid" placeholder="Heslo znovu">
</div>
<div class="form-group">
<input type="checkbox" required>
<p style="color: white;">Souhlasím s <a href="podminky.php">podmínkami</a></p>
</div>
<input type="submit" class="btn btn-primary">
</form>
*** <div class="" style="position: absolute; top: 175; left: 1000;">
<h2 style="color: white;">Už jseš zaregistrovaný?</h2>
</div>***
</body>

Editováno 19.5.2018 20:08

Nahoru Odpovědět

19.5.2018 20:07

Petr Čech

Tvůrce

Petr Čech:19.5.2018 23:51

Ahoj, tak zaprvé, používej tlačítko pro vkládání kódu - to "</>", mnohem lépe se to potom luští.
Očividně používáš Bootstrap, tak nepoužívej něco jako absolutní pozicování, Bootstrap určitě má lepší nástroj.
Kde chceš, aby se to zobrazilo? Přes celý formulář?, nad ním?, pod ním?
Další věc: takto se atribut style nepoužívá, udělej se css třídu. Style se ideálně nepoužije vůbec, nebo se použije velice zřídka na něco, co se třeba generuje dynamicky a nedá se to definovat v CSS souboru. Tady bys měl udělat něco jako

styles.css

.my-input{
        color: white;
}
.my-label{
        width: 40%;
}

html:

<div class="form-group">
        <label class="my-label" for="hesloid">Heslo</label>
        <input type="password" class="form-control my-input" name="heslo" id="hesloid" placeholder="Heslo">
</div>

A ještě jedna věc: "Už jseš zaregistrovaný?" není česky, předpokládal bych, že to má být "Jsi už zaregistrovaný?"

Nahoru Odpovědět

19.5.2018 23:51

the cake is a lie

Štěpán Karlovec

Člen

Štěpán Karlovec:19.5.2018 23:56

Jo neumím česky:D ne teď jsem za totálního idiota ale já se naučil jen základy a šel jsem na php. Potřebuju to dát vedle registračního formuláře. A nevím jak umí Bootstrap pozicovat. Maximálně vím container

Nahoru Odpovědět

19.5.2018 23:56

Petr Čech

Tvůrce

Petr Čech:19.5.2018 23:59

Tak se nauč víc než základy, bez toho to vážně nepůjde.
Bootstrap pozicovat umí, doporučuji přečíst si dokumentaci - alespoň prolistovat si, co to umí, abys to věděl a potom se k tomu vrátil. Jedna z nejlepších věcí, co Bootstrap umí je grid systém - nastuduj si to a nic jako pozicování už hodně dlouho potřebovat nebudeš, dokud se nerozhodneš udělat něco hodně exotického.

Akceptované řešení
+20 Zkušeností
+2,50 Kč

Nahoru Odpovědět

19.5.2018 23:59

the cake is a lie

Štěpán Karlovec

Člen

Štěpán Karlovec:20.5.2018 0:01

o tom jsem něco slyšel. Diky za odpověď a omlouvám za můj dementní dotaz .

Nahoru Odpovědět

20.5.2018 0:01

Peter Mlich

Člen

Peter Mlich:21.5.2018 15:51

U bootstrapu jsem si oblibil starou dokmentaci k verzi 2.3
Tady mas krasne vysvetlene, jak se to classuje, abys to mel vedle sebe. Jen si budes muset dohledat podobnou stranku pro svou verzi Jo, pripadne si klinki pak v menu na layout, taky. A pak mas uplne nahore Base CSS, taky zajimave.
https://getbootstrap.com/…folding.html#…
https://getbootstrap.com/…folding.html#…
https://getbootstrap.com/…ase-css.html

Editováno 21.5.2018 15:52

Nahoru Odpovědět

21.5.2018 15:51

Štěpán Karlovec

Člen

Štěpán Karlovec:21.5.2018 18:52

diky

Nahoru Odpovědět

21.5.2018 18:52

Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 9 zpráv z 9.