Velkost INPUTu – CSS – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu

Velkost INPUTu – CSS – Fórum – Programujte.comVelkost INPUTu – CSS – Fórum – Programujte.com

 

marioff0
Expert
20. 5. 2008   #1
-
0
-

ahojte...

ako docielim aby bol input typu text v kazdom prehliadaci rovnako velky ???

V Opere , FF a Safari je v pohode tak ako zadam do height...

ale v IE je vzdy o nieco "tensi" :(

ide mi len o tu velkost height, ostatne ako poziciu v dive viem nastavit.

Dakujem za Vasu pomoc... uz newiem fakt co s tym spravit...

Nahlásit jako SPAM
IP: 195.78.44.–
Škoda, že život sa nedá "sejvovať", tak že by som po zlom životnom rozhodnutí mohol začať odznova :([br] Lenivosť je matka pokroku.[br][br] http://cut.sk/ - odstrihni si dlhý link
Kobi
~ Moderátor
+1
Věrný člen
Nahlásit jako SPAM
IP: 194.228.4.–
marioff0
Expert
21. 5. 2008   #3
-
0
-

pouzil som:

height: 18px !important;
height /**/ : 24px;
padding: 2px 0px 2px 0px;


je to spravne ? vyzera ze to ide... len ten zapis... brrrrrrr..

heh len teraz som zistil ze IE ma uplne na haku padding u INPUTu... vobec ho neriesi :(

newiete ci ten hack funguje aj s width, este som to neskusal, bo som v robote.. :)

Alebo nepoznate nejaky lepsi sposob (bol by som rad :) ako som hore uviedol...??... :smile12:

Nahlásit jako SPAM
IP: 91.127.65.–
Škoda, že život sa nedá "sejvovať", tak že by som po zlom životnom rozhodnutí mohol začať odznova :([br] Lenivosť je matka pokroku.[br][br] http://cut.sk/ - odstrihni si dlhý link
sir_arthur
~ Redaktor
0
Stálý člen
21. 5. 2008   #4
-
0
-

neda sa nastavit line-height?mohlo by to pomoct...

Nahlásit jako SPAM
IP: 82.119.117.–
@mattonik
marioff0
Expert
21. 5. 2008   #5
-
0
-

sir_arthur napsal:
neda sa nastavit line-height?mohlo by to pomoct...



prepac ze otravujem... skus mi trochu viac priblizit ten line-height... teraz som v praci nemam moznost to skusit... aspon taku ukazku... ktora by bola funkcna v IE a v normalnych prehliadacoch

dakujem

Nahlásit jako SPAM
IP: 91.127.65.–
Škoda, že život sa nedá "sejvovať", tak že by som po zlom životnom rozhodnutí mohol začať odznova :([br] Lenivosť je matka pokroku.[br][br] http://cut.sk/ - odstrihni si dlhý link
marioff0
Expert
21. 5. 2008   #6
-
0
-

Tak narychlo som napisal ako si to predstavujem:



<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.w3.org/MarkUp/SCHEMA/xhtml11.xsd"
xml:lang="en" >
<head>
<title>TPD</title>

<STYLE type="text/css">
#hlavny {
border: 1px #ff8080 solid;
width: 900px;
height: 500px;
}

#okienko {
border: 1px #000000 solid;
width: 898px;
height: 40px;
}

#prvyinput {
border: 1px #22aa54 solid;
width: 340px;
height: 38px;
float: left;
}

#druhyinput {
border: 1px #22aa54 solid;
width: 520px;
height: 38px;
float: right;
text-align: right;
}

.prvy {
font-family: Arial;
font-size: 16px;
font-weight: bold;
width: 150px;
height: 18px;
padding: 2px 0px 2px 20px;
}

.druhy {
font-family: Arial;
font-size: 16px;
font-weight: bold;
width: 150px;
height: 18px;
padding: 2px 0px 2px 20px;
}

.treti {
font-family: Arial;
font-size: 16px;
font-weight: bold;
width: 150px;
height: 18px;
padding: 2px 0px 2px 20px;
}
</STYLE>

</head>
<body>
<div id="hlavny">

<div id="okienko">

<div id="prvyinput">

Zadaj text: <input type="text" class="prvy"> <input type="submit">

</div>

<div id="druhyinput">

Zadaj 2 texty: <input type="text" class="druhy"> <input type="text" class="treti"> <input type="submit">

</div>

</div>

</div>
</body>
</html>


Potreboval by som aby tie inputy boli presne vertikalne v strede divu kde sa nachadzaju, a aby aj text v inputoch bol presne v strede.(a aby boli aj rovnako velke a siroke) v KAZDOM prehliadaci... IE, FF, Opera a Safari.

Hlavne ta sirka a vyska, lebo to nastavenie toho aby boli inputy v strede viem urobit aj pomocou top, left, position....

Uz sa s tym babrem asi 2 dni a newiem co dalej.

Dakujem Vam za pomoc....

Nahlásit jako SPAM
IP: 91.127.65.–
Škoda, že život sa nedá "sejvovať", tak že by som po zlom životnom rozhodnutí mohol začať odznova :([br] Lenivosť je matka pokroku.[br][br] http://cut.sk/ - odstrihni si dlhý link
Fugess0
Návštěvník
21. 5. 2008   #7
-
0
-

pro FF, Operu, Safari atd. to res standardne height s paddingem ci marginem .. pro IE pouzij podmineny komentar na doladeni vysky s odsazenim .. to je asi nejspolehlivejsi zpusob

Nahlásit jako SPAM
IP: 80.78.146.–
Fugess
marioff0
Expert
21. 5. 2008   #8
-
0
-

Fugess prosim uved konkretny priklad, lebo trochu newiem co myslis, a ako to urobit :(...
dakujem

Nahlásit jako SPAM
IP: 91.127.65.–
Škoda, že život sa nedá "sejvovať", tak že by som po zlom životnom rozhodnutí mohol začať odznova :([br] Lenivosť je matka pokroku.[br][br] http://cut.sk/ - odstrihni si dlhý link
Fugess0
Návštěvník
21. 5. 2008   #9
-
0
-

nastyluj si input dle libosti ve FF podle toho jak se ti to nejvic libi .. potom to skus v Opere a Safari - tam by mel byt vysledek stejny (podle mych skusenosti)

potom se psychicky priprav na testovani v IE ...

predpokladam ze mas moznost svuj vysledek ozkouset v IE 7 - tam by to nemelo byt prehnane pokazene, ale i kdyby bylo tak pouzijes tento podmineny komentar ciste pro IE 7

<!--[if IE 7]>

<link rel="stylesheet" type="text/css" href="styles/styles_IE.css" media="screen" />
<![endif]-->
(obsah parametru pro cestu a typ media zalezi na tobe - tohle je jen pro demonstrativni ucel)

jeste par ukazek jak funguje podmineny komentar:
<!--[if IE]><![endif]--> - to co ma napsane uvnitr pouzije pro vsechny IE

<!--[if IE 6]><![endif]--> - to same, akorat plati pouze pro IE 6
<!--[if IE 7]><![endif]--> - to same pro ie 7
<!--[if lte IE 6]><![endif]--> - to co je uvnitr pouzije pro IE 6 a vsechny starsi
<!--[if gte IE 6]><![endif]--> - to co je uvnitr pouzije pro IE 6 a vsechny novejsi
to by z nazorneho prikladu mohlo stacit...


no a pak jeste prijde nejvetsi sranda - testovani v IE 6 ... jakmile nalinkujes podminenym komentarem styl napriklad pro IE 6 tak uz jen ve sablone stylu k tomu urcene upravis dotycne selektory se soubory deklaraci podle toho jak to IEsvestce a tobe vyhovuje...

ps: znate tyto stranky ? http://www.stopie.com/ :smile1:

Nahlásit jako SPAM
IP: 80.78.146.–
Fugess
sir_arthur
~ Redaktor
0
Stálý člen
21. 5. 2008   #10
-
0
-

no ja neviem, ja som skusal input nastavit vysku a mam rovnaku aj v ff aj v ie6 tusim.ak chces ale zarovnat text v inpute na stred vertikalne:

<html>

<head>
<style>
input{width:100px;height:50px}
</style>
</head>
<body>
<input type="text" />
</body>
</html>

Nahlásit jako SPAM
IP: 82.119.117.–
@mattonik
Fugess0
Návštěvník
21. 5. 2008   #11
-
0
-

no je celkem samozrejme ze se zakladnim stylovanim inputu je zbytecne pouzivat podmineny komentar .. ale pri dalsim stylovani bys ho urcite pouzil ...

Nahlásit jako SPAM
IP: 80.78.146.–
Fugess
marioff0
Expert
21. 5. 2008   #12
-
0
-

no ja planujem pouzit iba width height padding, background a border, cize to je asi len zakladne stylovanie :) nie?? :D

a na toto co vravite... ani newiem co toje....co to znamena tie znaky :(

height: 18px !important;
height /**/ : 24px;
padding: 2px 0px 2px 0px;

??

Nahlásit jako SPAM
IP: 91.127.65.–
Škoda, že život sa nedá "sejvovať", tak že by som po zlom životnom rozhodnutí mohol začať odznova :([br] Lenivosť je matka pokroku.[br][br] http://cut.sk/ - odstrihni si dlhý link
Fugess0
Návštěvník
21. 5. 2008   #13
-
0
-

to je jenom blbe zapsany komentar..
s tim stylovanim to uvidis sam co ti to udela .. ja jsem pro input text pouzivat podminene komentare nemusel .. ale pro input button, select s option, a pro obalove celky form s fieldset to bylo vetsinou nutne ..

Nahlásit jako SPAM
IP: 80.78.146.–
Fugess
marioff0
Expert
21. 5. 2008   #14
-
0
-

OK vsetko skusim...

PS: dobre stranky :smile3:

Nahlásit jako SPAM
IP: 195.78.44.–
Škoda, že život sa nedá "sejvovať", tak že by som po zlom životnom rozhodnutí mohol začať odznova :([br] Lenivosť je matka pokroku.[br][br] http://cut.sk/ - odstrihni si dlhý link
marioff0
Expert
22. 5. 2008   #15
-
0
-

tak som sa rozhodol ze budem mat dva CSS-ka, jeden pre normalne prehliadace, druhe pre jeden trhly IE

mozem to urobit takto: ?



<!--[if !IE]>
<link rel="stylesheet" type="text/css" href="styl_pre_normalneprehliadace.css" media="screen" />
<![endif]-->

<!--[if IE]>
<link rel="stylesheet" type="text/css" href="styl_pre_IE.css" media="screen" />
<![endif]-->


alebo existuje aj alternativa , nieco ako if else ??? ze ak nie je IE tak nacitaj prvy styl, ak je tak druhy styl ??

diki za trpezlivost :)

Nahlásit jako SPAM
IP: 91.127.65.–
Škoda, že život sa nedá "sejvovať", tak že by som po zlom životnom rozhodnutí mohol začať odznova :([br] Lenivosť je matka pokroku.[br][br] http://cut.sk/ - odstrihni si dlhý link
Fugess0
Návštěvník
22. 5. 2008   #16
-
0
-

pro normalni prohlizece pouzijes standardni zapis, tj:

<link rel="stylesheet" type="text/css" href="styl_pre_normalneprehliadace.css" media="screen" />


a pro IE pouzijes tohle:
<!--[if IE]>

<link rel="stylesheet" type="text/css" href="styl_pre_IE.css" media="screen" />
<![endif]-->


tj: vsechny prohlizece prectou prvni zapis, a IEcka prectou prvni a pak kdyz uvidi podmineny komentar pro sebe tak jej take prectou ...

tzn. nastylujes neco a pro IEcka ty styly zvlast upravis - v tom je ten figl :smile1:

jinak nezapomen dodrzet kaskadu (poradi) linku .. tzn: prvni musi byt centralni a pod nim styly pro IEcka ..
priklad takoveho pouziti:
link - reset styly

link - centralni styly
link - styly pro IE 7 (poradi pro verze jsou nedulezite)
link - styly pro IE 6
atd.
.
.
.


nebo i napriklad:
link - global styles - a v nem importy - reset styly a pod nema centralni styly

link - styly pro IE
atd.
.
.
.

Nahlásit jako SPAM
IP: 80.78.146.–
Fugess
marioff0
Expert
23. 5. 2008   #17
-
0
-

jj chapem ta, ale stale ma hloda jedna vec:

nebude to zbytocne tahat v pripade uzivatela IE naviac data, neni lepsie ked sa priamo stiahne CSS pre konkretny prehliadac.??..

Nahlásit jako SPAM
IP: 78.99.42.–
Škoda, že život sa nedá "sejvovať", tak že by som po zlom životnom rozhodnutí mohol začať odznova :([br] Lenivosť je matka pokroku.[br][br] http://cut.sk/ - odstrihni si dlhý link
Fugess0
Návštěvník
23. 5. 2008   #18
-
0
-

nene takhle to je prave dobre reseni .. nastylujes stranky tak jak chces aby vypadaly a pak uz jen pro IEcka ty styly doladis .. stylovat dvakrat tu samou sablonu s odchylkama by bylo zbytecne .. jde o ten ucel ze IEcka uvidi zakladni styl stranek a pak uvidi sablonu ktera opravuje nejasnosti

Nahlásit jako SPAM
IP: 80.78.146.–
Fugess
marioff0
Expert
23. 5. 2008   #19
-
0
-

aha.... ok... tak ja si necham poradit, dakujem za fakt profesionalne rady..

este raz diki

Nahlásit jako SPAM
IP: 78.99.42.–
Škoda, že život sa nedá "sejvovať", tak že by som po zlom životnom rozhodnutí mohol začať odznova :([br] Lenivosť je matka pokroku.[br][br] http://cut.sk/ - odstrihni si dlhý link
Zjistit počet nových příspěvků

Přidej příspěvek

Toto téma je starší jak čtvrt roku – přidej svůj příspěvek jen tehdy, máš-li k tématu opravdu co říct!

Ano, opravdu chci reagovat → zobrazí formulář pro přidání příspěvku

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 2 hosté

Podobná vlákna

Kombinace inputů — založil Caterpillar

Sečtění dvou inputů — založil tommassino

Validace inputu a divu — založil Nazghul-CZ

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032024 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý