textbox css ...

Ας μάθουμε πως να κάνουμε τις σελίδες μας με στιλ. Τα Cascading Style Sheets είναι ο τρόπος για να το επιτύχουμε.

Συντονιστές: WebDev Moderators, Super-Moderators

Απάντηση
dianikol
Δημοσιεύσεις: 108
Εγγραφή: 21 Ιαν 2008 15:56

textbox css ...

Δημοσίευση από dianikol » 01 Μαρ 2010 23:13

γεια σας στο φόρουμ, η ερωτηση μου ειναι η εξις: μεσα στα κελια ενος πινακαεχω βαλει textboxes πχ.

<table>
<tr>
<td><input type='text' name='' /></td>
<td><input type='text' name='' /></td>
</tr>
</table>

Πως γινεται λοιπον τα textboxes αυτα να εχουν ιδιο width & heigt με τα αντιστοιχα των κελιων του πινακα? Τι πρεπει να γραψω στο css?? Εχω δοκιμασει μερικα πραγματα αλλα δεν το βρηκα...

ευχαριστω

Άβαταρ μέλους
dimsis
Reporter
Δημοσιεύσεις: 7994
Εγγραφή: 25 Ιούλ 2001 03:00

textbox css ...

Δημοσίευση από dimsis » 02 Μαρ 2010 08:19

Αν δεν φτιάξεις ξεχωριστό αρχείο css βάλε ανάμεσα στο <head></head> αυτό:
<style>
table.tbl input { width:100px;height:22px }
</style>

και άλλαξε το <table> σε <table class="tbl">

Κώδικας: Επιλογή όλων

<html>
<head>
<style>
table.tbl input &#123;
	width&#58;180px;
	height&#58;22px
&#125;
</style>
</head>
<body>
<form id="frm">
	<table class="tbl">
		<tr>
			<td><input type="text" name="t1" id="t1" /></td>
			<td><input type="text" name="t2" id="t2"  /></td>
		</tr>
		<tr>
			<td><input type="text" name="t3" id="t3" /></td>
			<td><input type="text" name="t4" id="t4"  /></td>
		</tr>
		<tr>
			<td><input type="text" name="t5" id="t5" /></td>
			<td><input type="text" name="t6" id="t6"  /></td>
		</tr>
	</table>
</form>
</body>
</html>
ακόμα καλύτερα μη βάζεις καθόλου table και φτιάξε τη φόρμα κάπως έτσι:

Κώδικας: Επιλογή όλων

<html>
<head>
<style>
form.frm input &#123;
	width&#58;180px;
	height&#58;22px;
&#125;
form.frm div &#123;
	float&#58;left;
&#125;
form.frm .row &#123;
	clear&#58;both;
&#125;
</style>
</head>
<body>
<form class="frm" id="frm">
	<div class="row">
		<div>
			<label for="t1"></label>
			<input type="text" name="t1" id="t1" />
		</div>
		<div>
			<label for="t2"></label>
			<input type="text" name="t2" id="t2"  />
		</div>
	</div>
	<div class="row">
		<div>
			<label for="t3"></label>
			<input type="text" name="t3" id="t3" />
		</div>
		<div>
			<label for="t4"></label>
			<input type="text" name="t4" id="t4"  />
		</div>
	</div>
	<div class="row">
		<div>
			<label for="t5"></label>
			<input type="text" name="t5" id="t5" />
		</div>
		<div>
			<label for="t6"></label>
			<input type="text" name="t6" id="t6"  />
		</div>
	</div>
</form>
</body>
</html>

Απάντηση

Επιστροφή στο “CSS - Cascading Style Sheets”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 1 επισκέπτης