Ûrlapok

[Keveqiah]

adhatsz neki külön class-okat és akkor könnyebben felül tudod írni az elemek tulajdonságait.

[M. Tamás]

Nem tudom mi a baj ezzel. Így az optgroup és az option is ugyan olyan lesz.
De max azt megcsinálhatod, hogy optgroup option {  } -ban a formázásokat törlöd.

Ez így elég rossz. Gondoltam van ezen kívül más lehetőség... Azért kösz!

[Keveqiah]

Nem tudom mi a baj ezzel. Így az optgroup és az option is ugyan olyan lesz.
De max azt megcsinálhatod, hogy optgroup option {  } -ban a formázásokat törlöd.

[M. Tamás]

Az optgroup-to hogyan formázzam meg, hogy a benne lévő option ne? Példa: http://mafia.realgameguides.com/?letoltesek=ikarus260->alul (formázatlanná van beállítva jelenleg).

Kód: CSS

1. optgroup{font-style:normal;font-weight:normal;}

[Keveqiah]

Az lenne a gondom,

A sidebar_bottom -ban lévő formnak van egy alsó marginja ha ezt nullára állítod, jó lesz.

[tomi6230i]

@birmar2:
Nem ebben a részben van a hiba, valószínűleg a felette található elemnél van valami rosszul beállítva, de ezen sem tudunk segíteni kód nélkül.
Így esetleg csak ezt tudnám javasolni, de ez nem szép megoldás:

Kód: CSS

1. .sidebar_bottom {
2.         width: 250px;
3.         height: 7px;
4.         background: url('images/sidebar_bottom_bg.png') no-repeat;
5.         position: relative;
6.         top: -10px;
7. }

[tomi6230i]

Ezek szerint te sem nézted meg a példákat.

Hát akkor valóban nem értettem meg, mart azt hittem, hogy arról van szó, amikor egy sorban adunk meg 4,3 vagy 2 értéket. Elnézést

[birmar2]

Az lenne a gondom, hogy a keret alja lejjebb van a kelleténél, de nem tudom mit kéne módosítanom: http://mcmgame.hu/birmarsoft/sidebar.GIF

Kód: CSS

1. .sidebar_bottom {
2.         width: 250px;
3.         height: 7px;
4.         background: url('images/sidebar_bottom_bg.png') no-repeat;
5. }
6.  

[Keveqiah]

Ezek szerint te sem nézted meg a példákat. Ha csak 1x írod be, hogy 256px akkor azt mind a 4 irányba be fogja állítani. Ilyenkor felesleges a maradék három, de ha több irányba más más értéket akarsz megadni, egyszerűbb, mint a padding-left, padding-right, stb..

[tomi6230i]

Miért lenne lassabb? o.O

Azért lassabb a kódolás, mert nem azt pötyögöm be, hogy 256px, hanem 256px 256px 256px 256px, oké, hogy kijelölöm, majd 4x bemásolom, de az is felesleges munka.

[birmar2]

Megoldva, köszönöm

[Keveqiah]

Miért lenne lassabb? o.O
És nem azt mondtam, hogy nem szabad 1-2-3 értéket megadni, csak tudni kell(ene) hogy ilyenkor mik a következmények. (Lásd lentebbi példa)

[tomi6230i]

Ezt csak azért mondom, hogy mind a 4 értéket meg kell adni. (kevesebb hibalehetőség) Az nem baj, ha a többi 0 (nulla).

De lassabb a kódolás, én van, hogy 1-et, 2-őt, 3-at vagy 4-et adok meg.

[Keveqiah]

Cseréld le erre a css-t. És látszani fog a beleírt szöveg is.

Kód: CSS

1. input, textarea
2. {
3.    border: 1px solid #CCCCCC;
4.    color: #000000;
5.    font-size: 12px;
6.    height: 25px;
7.    margin: 0;
8.    padding: 2px;
9. }
10.  

ha egy tulajdonságnak több értéket szeretnél megadni, érdemes betartani az erre vonatkozó szabályokat.

W3Schools

padding:25px 50px 75px 100px;

    * top padding is 25px (felső)
    * right padding is 50px (jobb oldali)
    * bottom padding is 75px (alsó)
    * left padding is 100px (bal oldali)

Ezt csak azért mondom, hogy mind a 4 értéket meg kell adni. (kevesebb hibalehetőség) Az nem baj, ha a többi 0 (nulla).

És a példa, hogy miért nem látszódott a beírt szöveg.

# padding:25px 50px;

    * top and bottom paddings are 25px
    * right and left paddings are 50px

Te csak két értéket adtál meg. Jelenleg i formájában:

Kód: CSS

1. input, textarea {
2. .....
3. margin:10px 0;
4. padding:10px 0;
5. ....
6. }
7.  

vagyis a az elem távolsága más elemektől (margin) -> föntről - lentről 10 px
az elemben lévő tartalom belső távolsága az elem keretétől (padding) ->  föntről - lentről 10 px
ui. és a betűméret is 20-as. Ami már alapból kilóg az input mezőből és ezt fűszerezve alsó fölső paddingal, már nem is látszik a beírt szöveg.

[birmar2]

Újabb gondom van, hiába állítok az input magasságán, nem növekszik :S
height: 20px;

[birmar2]

Köszönöm

[tomi6230i]

Kód: CSS

1. padding: 0px 10px;

Ez miatt kezdi 10 pixellel beljebb, ugyanis ez a sor azt mondja meg, hogy felül és alul a belső margó 0 pixel, oldalakon pedig 10 pixel legyen.

[Isti861]

padding: 0px 0px;

[birmar2]

Most már látszik a szöveg, de azt nem értem, hogy miért beljebb tudok csak írni :O

[Warner]

Áthelyeztem, mert a PHP-hoz sok köze nincs.

[pixi]

A font méretet is vedd kissebbre, 15 helyett 14-re, de inkább 13-ra, hogy egyáltalán beleférjen a szöveg az ablakba, verticálisan.
A paddingot is módosítsd az alábbiak szerint, hogy az alsó és felső 0 legyen:

Kód: CSS

1. input, textarea {
2. font-size: 13px;
3. padding: 0px 10px;

[Rimelek]

Úgy látom, valamit csináltál, mert már működik az oldaladon.

[birmar2]

Tőlem kérdezheted.
CSS-be ezt firkáltad:

Kód: CSS

1. color: #00000;

Nos a színkódot 3 vagy 6 jegyű hexadecimális számmal kell megadni, de ezt gondom tudod te is, csak elírtad. A Chrome volt olyan kedves, és kijavította neked, de ettől függetlenül még ez a hiba.
Elküldve:: 2010. Október 12.  20:10:21Egyébként ezt a FireFox Web Developer nevű kiegészítője ki is írja, tesztelésnél érdemes használni 

Ezt firkáltam? color: #00000;
Én ilyet nem látok sehol, lehet rossz a szemem, de az is lehet hülkye vagyok, nem nagyon foglalkozok cssel

[Rimelek]

Egyébként ezt a FireFox Web Developer nevű kiegészítője ki is írja, tesztelésnél érdemes használni  

Igen hasznos dolog.   Én is azzal néztem, csak nekem már el kellett mennem, ezért nem is kerestem a hiba okát. Csak kivágtam mindent a html-ből az inputon kívül és megmaradt a "hiba" így már sejthető volt a probléma oka.

[tomi6230i]

Azt most ne kérdezd, chrome-ban miért jó.

Tőlem kérdezheted.
CSS-be ezt firkáltad:

Kód: CSS

1. color: #00000;

Nos a színkódot 3 vagy 6 jegyű hexadecimális számmal kell megadni, de ezt gondom tudod te is, csak elírtad. A Chrome volt olyan kedves, és kijavította neked, de ettől függetlenül még ez a hiba.
Elküldve:: 2010. Október 12.  20:10:21Egyébként ezt a FireFox Web Developer nevű kiegészítője ki is írja, tesztelésnél érdemes használni 

[pixi]

De az a vicc, hogy nincs átállítva :O

Kód: CSS

1. /*
2. label {......}
3. */
4. /*
5. input {......}
6. */
7.  

Akkor kezd kizárásos alapon. Először tedd mindkettőt megjegyzésbe, aztán csak az egyiket, majd a másikat. Pillanatok alatt kiderül, hogy melyik rontja el.

Ha a fentiekkel sem javul meg, akkor még az <inputokban levő id="medium_input" class="medium" részt is ugyan így meg kell műteni.

Megjegyzés: a css-ben az inputra vonatkozó padding: 10px; helyett: padding: 2px 10px;

[birmar2]

De az a vicc, hogy nincs átállítva :O

Kód: CSS

1. label
2. {
3.         font-family: Arial, Tahoma, sans-serif;
4.         font-size: 13px;
5.         color: #9c9c8e;
6.         margin: 0px 0px 5px 0px;
7.         display: block;
8.         clear: both;
9. }
10.  
11. input
12. {
13.         font: normal 15px Arial, Tahoma, sans-serif;
14.         color: #777777;
15.         margin: 10px 0px 10px 0px;
16.         padding: 10px;
17.         display: block;
18.         border: 1px solid #cccccc;
19.         width: 95%;
20.         height: 18px;
21. }
22.  

[Rimelek]

Tudsz írni az inputba. Csak valahol beállítottad fehérre a szöveg színét. És nem látszik, mikor beírod. De gépelj az inputba, majd jelöld ki a látszólag semmit. Másold és illeszd be valahova. Akkor látni fogod, tehát írni írhatsz bele, csak nem látod.

Azt most ne kérdezd, chrome-ban miért jó.

[birmar2]

Sziasztok
Még sose láttam ilyen hibát, nem tudom mi lehet a gond, mozillába egyszerűen nem tudok írni a szöveg mezőbe, chromeba tudok, de arrébb csúszik a szöveg, többi böngészőbe már meg se néztem :S
Remélem nem számít reklámnak, a hibát itt láthatjátok: www.mcmgame.hu/birmarsoft/
Segítségeteket előre is köszönöm

Kód: PHP

1. <html>
2. <head>
3.         <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2"/>
4.  
5.         <title>BirmarSoft-Főoldal</title>
6.         <link rel="stylesheet" href="style.css" type="text/css" />
7.         <!--[if IE 6]><link rel="stylesheet" href="ie_styles.css" type="text/css" /><![endif]-->
8.  
9.  
10. </head>
11.  
12. <body>
13.  
14.         <div id="wrapper">
15.  
16.                 <div id="header">
17.                         <!-- logo - editable via logo.png -->
18.                         <div id="logo"></div>
19.                         <div id="user_links">
20.             <!-- Ide jönnek majd a fontosabb felhasználói menük-->
21.                         </div>
22.                 </div>
23.  
24.                 <div id="nav">
25.                         <ul>
26.                                 <li class="current"><a href="index.php">Főoldal</a></li>
27.                                 <li><a href="regisztracio.php">Regisztráció</a></li>
28.                                 <li><a href="#">Fórum</a></li>
29.                                 <li><a href="#">GYIK</a></li>
30.                         </ul>
31.                 </div>
32.  
33.                 <div id="content">
34.                         <div id="left">
35.  
36. <?php
37. if (isset($_POST['belepes'])) {
38. include('beallitasok.php');
39. $email = htmlspecialchars($_POST['email']);
40. $jelszo  = htmlspecialchars($_POST['jelszo']);
41. $Sql  = mysql_query("SELECT * FROM tagok WHERE email = '".$email."' AND jelszo = '".$jelszo."'");
42.  
43. if ( empty($_POST['email']) OR empty($_POST['jelszo']) ) {
44. print'
45. <p class="alert"><span class="error"></span><span class="error_text">Nem töltöttél ki minden mezőt</span></p>
46. ';
47. }
48. else if ( mysql_num_rows($Sql) == 0 ) {
49. print'
50. <p class="alert"><span class="error"></span><span class="error_text">Hibás E-mail cím és/vagy jelszó</span></p>
51. ';
52. }
53. }
54. ?>
55.                                 <div class="div_header">Hírek</div>
56.                                 <div class="div_content">
57.                                 <p>
58. Az oldal hamarosan elindul, türelem...
59.                         </p>
60.                                 </div>
61.                                 <div class="div_bottom"></div>
62.  
63.                                 <br class="clear" />
64.  
65.                         </div>
66.  
67.                         <!-- edit sidebar items here -->
68.                         <div id="sidebar">
69.                                 <div class="sidebar_header">Bejelentkezés</div>
70.                                 <div class="sidebar_content">
71.                 <form action="" method="post">
72.                                                         <label>E-mail cím:</label>
73.                                                         <input type="text" name="email" id="medium_input" class="medium" />
74.                             <label>Jelszó:</label>
75.                                                         <input type="password" name="jelszo" id="medium_input" class="medium" />
76.                             <input type="submit" class="submit" name="belepes" value="Bejelentkezés" />
77.                             <br><br>
78.                                         </form>                 </div>
79.                                 <div class="sidebar_bottom"></div>
80.                         </div>
81.                 </div>
82.                         <div id="footer">
83.                         <div id="copyright">Copyright &copy; 2010 BirmarSoft</div>
84.                         <div id="footer_links">
85.                         </div>
86.                 </div>
87.  
88.         </div>
89.  
90. </body>
91. </html>
92.  

[Rimelek]

Mivel úgy láttam, nyoma nem volt a hozzászólásokban CSS-nek, ezért áthelyeztem ide mindent.
http://phpstudio.hu/forum/index.php/topic,270.0.html

[Zordon]

Köszi!

[Rimelek]

width tulajdonságát állíthatod 100% -ra. Attól a mérete is változik. Csak a size azt hiszem karakter számban határozza meg a szélességet. password mező nem is minden böngészőben azonos hosszú a text mező hosszával. De width-el megadva már pontosan megadható.

[Zordon]

Sziasztok!

Egy kérdésem lenne!?
Hogy hogyan lehet (input és textarea) beviteli mezőket dinamikusan növelni mert a size parancshoz csak egy megadott mezőt lehet de ezt nem lehet megoldani valahogy hogy 100%-ra állítom és kész? vagyis nem a size='100%' hanem css-be?

[Warner]

Úgy tűnik senkit nem zavart, hogy ennek semmi köze a PHP-hoz.
Áthelyeztem.

[Rimelek]

Ahogy gondolod, de az viszont tény, hogy teljesen értelémetlen/felsleges egy div-nek link osztályt adni, és abba tenni a linket, amiben egy span van, amit formázol. Akkor már a link-eknek add a link osztályt, és ha submit gomb van, akkor annak is.

Tudom, már nem változtatsz, de a jövőben jobb, ha akkor használsz js-t, ha muszáj, valamint úgy használod a html-t, és css-t, ahogy logikus.

[Semmu]

jónak tűnik, de egyszerűbb ha egy div-ben még span-t használok, és akkor a div.xy span automatikusan vonatkozna a divben lévő spanra, de nekem elég a js, szal már nem változtatok

[Salaander]

ha így csinálod linkre és submitra is jó lesz

#bal {
width: ;  /// egyértelműen a kép szélessége, hogy egybeérjen a középső elemmel
height: ; // a kép magassága
background-image: url("balhataroloresz.gif");
background-repeat: no-repeat;
}
#gomb {
padding: 2px ; // ez a szöveg miatt de legyen jó a kép magasságával és a szélességét ne add meg így ez dinamikus lesz de tegéyl két oldalra hosszab paddingot ha kell
height: ; // a kép magassága
background-image: url("balhataroloresz.gif");
background-repeat: no-repeat;

#jobbl {
width: ;    /// egyértelműen a kép szélessége, hogy egybeérjen a középső elemmel
height: ; // a kép magassága
background-image: url("balhataroloresz.gif");
background-repeat: no-repeat;
}


ezek után
<div id="bal"></div><div id="gomb">Regisztráció</div><div id="jobb"></div>

így képzelem de csak összecsaptam mert mennem kell már bye all jóéjt majd holnap módosítom ha nem jó

[Semmu]

váááá 

szóval itt ezt arra használnám, h pl lenne a profil módosító form, annak elküldésére..
vagy regre...
vagy bejelentkezéshez

tudom, meg lehet csinálni css-el, h maga a submit gomb is ilyen formátumú legyen, de egyenlőre jó nekem a js is, mivel a jelenlegi formátum nem cs submit gombokra alkalmazható, hanem így bármilyen linkre, és mivel én nem cs formokban akarom használni, ezért ez praktikusabb....

remélem érthető, s letisztáztam végre 

amúgy egy példalink, és a css

Kód: [Kijelölés]

<div class="link"><a href="?site=beallitasok"><span>Szerkeszt&eacute;s</span></a></div>

.link a{
float:left;
background:url(linkjobb.jpg) no-repeat right;
font-family:"Trebuchet MS", Arial, Helvetica,sans-serif;
font-size:13px;
color:#fff;
text-decoration:none;
}

.link a span{
float:left;
height:25px;
line-height:25px;
background:url(linkbal.jpg) no-repeat left;
padding:0px 20px 0px 20px;
}
.link a:hover
{
background:url(linkjobbhover.jpg) no-repeat right;
color: #FFFFFF;
}
.link a:hover span
{
background:url(linkbalhover.jpg) no-repeat left;
color: #FFFFFF;
}


[Salaander]

De megoldhatod úgy is hogy dinamikus legyen a kép de azt is css-el ajánlanám de a te dolgod, mint egy menü box beállítod pl legyen eleje közepe ami dinamikusan nő a szöveggel és a lezáró rész és akkor is dinamikus

[Rimelek]

Most ha linkekről van szó, aminek semmit nem kell elküldeni, akkor annak tényleg nincs köze az űrlaphoz Csak annyi, hogy az űrlap alá szoktuk kitenni a regisztráció linket. És ahhoz tényleg nem kell akkor submit gomb. Csak egy képlink, vagy egy div, megfelelő szélességgel és magassággal, adott háttérrel, és ráírva szöveggel hogy Regisztráció.

Látom nem regisztráció, hanem regisztráció törlése. De ezzel csak mégjobban igazam van

[Semmu]

a-a, ez nem jó, mert ennek a háttere dinamikus, szal a benne lévő szöveg méretétől függ...
megtudnám csinálni ugyanígy input gombnak is, de a js is tökéletesen működik...
aki meg letiltja a js-t, az magára vessen

[<madbence />]

Most, hogy látom mihez kéne, Salaander megoldását javaslom én is.

[Salaander]

ez a legegyszerűbb te a submit hátterének berakod a kék képet és átállítod a színt fehérre

background-image: url("kekkerekgomb.gif");
background-repeat: no-repeat;
color: #FFFFFF;
width: //ezt a kép hosszára állítod
height: // ezt a kép magasságára

[Semmu]

igaz
igazából azért kéne, mert a linkeket ilyen faja gombbá szeretném csinálni, like , és nemtom, h submit-et használjak, vagy sima linket, amihez ugye már kész a formázás.
lehet a MadBence féle megoldást fogom használni

[<madbence />]

A lényeg nem épp az, hogy submit gomb ne legyen?

[Rimelek]

Nem a:hover, mert nem link, csak annak tüntetnéd fel. tehát az input nak kell egy class="submit"

És css-ben:

Kód: CSS

1. .submit
2. {
3.         color : blue;
4. }
5. .submit:hover
6. {
7.         color: red;    
8. }

[Semmu]

az
xy  a:hover
lenne
köszi a gyors válaszokat!

[Salaander]

igazad van akkor így
border: 0px;
background-color: none;
cursor: pointer;
color: #ide a link színe;

azt hogy ha főlé viszed a színe úgy változzon mint a linké nem tudom de majd más megmondja gondolom (mert az már js lenne megint)

[Rimelek]

A te megoldásod viszont abból a szempontból jobb, hogy nem javascript függő. És ha nem kell semmi másra a js, pl ellenőrzésre, akkor én kerülném a js-t.
Csak a hátteret nem az oldal háttérszínére kell állítani, hanem none értékre. És akkor nem lesz neki. Plusz a kurzort is át kell állítani akkor hogy ha rávisszük az egeret, a kis kéz jelenjen meg, mint linkeknél. És a rajta levő szöveg színét is módosítani kell úgy, mint linkeknél .Több sor, bonyolultabb, de nem js függő
Kinek mi tetszik jobban.

[Salaander]

Nem tudom de css-el megcsinálhatod hogy csak szövel látszódjon ami majdnem ugyanolyan szerintem:

border: 0px;
background-color: #háttérszíne;

szerintem így persze lehet rendes megoldása is

... látrom MadBEnce már írt megoldást de így is csinálhatod bár az elegánsabb ...

[<madbence />]

A link onclick-re berakod a form submit() metódusát, valahogy így:

Kód: [Kijelölés]

<a href="#" onclick="document.forms[0].submit();">Elküldés</a>

[Semmu]

form submit gombot h lehet linkkel helyettesíteni?