+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: Początkujący webmaster (https://www.webmastertalk.pl/forum-poczatkujacy-webmaster)
+--- Wątek: XHTML/CSS/PHP Ustawienie szerokości kolumn w tabeli. (/thread-xhtml-css-php-ustawienie-szeroko%C5%9Bci-kolumn-w-tabeli)
Strony:
1
2
XHTML/CSS/PHP Ustawienie szerokości kolumn w tabeli. - hghormone - 27-02-2011
Witam.
Tworze sobie baze danych potrzebną do serwisu i mam problem, ponieważ nie mogę ustawić własnych szerokości kolumn.
XHTML:
Kod:
<?php
print '<?xml version="1.0" encoding="iso-8859-2"?>';
print '<?xml-stylesheet type="text/css" href="xhtml.css"?>';
?>
<!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">
<head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-2" />
<link rel="stylesheet" href="style.css" type="text/css" />
</head>
<body>
<?
include("polacz.php");
mysql_connect('localhost',$username,$password);
@mysql_select_db($database) or die("Nie odnaleziono bazy danych");
$query="SELECT * FROM przyjecia";
$result=mysql_query($query);
$num=mysql_numrows($result);
mysql_close();
?>
<!-- To jest miejsce na treść dokumentu -->
<table>
<h1>Serwis</h1>
<thead>
<tr>
<td>ID</td>
<td>Data przyjęcia</td>
<td>Model</td>
<td>Imei</td>
<td>Uwagi</td>
</tr>
</thead>
<tbody>
<?
$i=0;
while ($i < $num) {
$did_pozycja=mysql_result($result,$i,"id_pozycja");
$ddata_przyjecia=mysql_result($result,$i,"data_przyjecia");
$dmodel=mysql_result($result,$i,"model");
$dnr_imei=mysql_result($result,$i,"nr_imei");
$duwagi=mysql_result($result,$i,"uwagi");
?>
<tr>
<td><? echo $did_pozycja ?></td>
<td style="width: 100px"><? echo $ddata_przyjecia ?></td> <!-- Ta kolumna nie chce dostosować się do wartości "width" -->
<td><? echo $dmodel ?></td>
<td><? echo $dnr_imei ?></td>
<td><? echo $duwagi ?></td>
</tr>
<?
$i++;
}
?>
</tbody>
<tfoot>
<tr>
<td colspan="5">HTML/CSS/PHP/MySQL</td>
</tr>
</tfoot>
</table>
<div style="position: absolute; left: 10px; top: 75px">
<form action="wpis.php" method="post">
<fieldset>
<legend>Edycja</legend>
<label>Data przyjęcia:</label> <input type="text" name="data_przyjecia" class='i1'><br>
<label>Model:</label> <input type="text" name="model" class='i1'><br>
<label>Nr imei:</label> <input type="text" name="nr_imei" class='i1'><br>
<label>Uwagi:</label> <input type="text" name="uwagi" class='i1' ><br>
<label></label><input type="submit" value="Wyślij" style="margin: 2px 4px 0px 4px;">
</fieldset>
</form>
</div>
</body>
</html>CSS:
Kod:
h1 {
text-align: center;
}
table {
width: 600px;
margin: 0 auto;
}
table thead {
background: #000;
color: #fff;
}
table tbody {
background: transparent;
color: #000;
}
table tfoot {
background: #525252;
color: #fff;
text-align: right;
}
table tfoot a:link, table tfoot a:visited {
color: #fff;
text-decoration: underline;
}
table tfoot a:hover {
color: #fff;
text-decoration: none;
}
table tbody tr:hover {
background: #FFE9A0;
}
table tbody tr:nth-child(even) {
background: #EBEBEB;
}
table tbody tr:nth-child(odd) {
background: #D6D6D6;
}
table tbody tr:hover {
background: #FFE9A0;
}
.i1 {
background-color:#EBEBEB;
border: 1px solid #006;
margin: 2px 4px 0px 4px;
}
label {
display: block;
width: 150px;
float: left;
margin: 2px 4px -1px 4px;
text-align: right;
}Konkretnie chodzi o pozycje:
Kod:
<td style="width: 100px"><? echo $ddata_przyjecia ?></td>RE: XHTML/CSS/PHP Ustawienie szerokości kolumn w tabeli. - Kartofelek - 27-02-2011
1) klasy, klasy, klasy.
Nie <td style="......"> a <td class="waskie">
2)
Masz:
<table>
<h1>Serwis</h1>
Powinno być:
<table>
<caption>Serwis</caption>
Wygląd uzyskasz w stylach
3) table-layout:fixed - możesz dodać dla table (poczytaj w google).
4) Z tabelkami już tak jest, że różnie się renderują. Kilka porad:
* Stosuj cellpadding="0" cellspacing="0" jako atrybuty table. Uratują ci często życie
* Szerokość td jest uzależniona od jej wnętrza. Dlatego może ci się wszystko rozwalać, gdy tekst będzie za długi
* TD nie ma position:relative; Jeżeli chcesz coś takiego mieć, wtedy musisz zagnieździć div
* czasami łatwiej jest stosować Liste zamiast tabeli. Sporadycznie ale zdarza się
RE: XHTML/CSS/PHP Ustawienie szerokości kolumn w tabeli. - hghormone - 27-02-2011
Dzięki za podpowiedzi.
Napisałeś,że "Szerokość td jest uzależniona od jej wnętrza. Dlatego może ci się wszystko rozwalać, gdy tekst będzie za długi", a ja właśnie mam ten problem, że np kolumna "Uwagi", będzie zawsze zawierała dużo informacji i nie zmieszczą się one w niej ,ale nie zależy mi na tym, w kolumnie wystarczy, że będzie widać tylko kawałek tekstu, reszte obsłuże tak, że kolumna uwagi wyświetli się potem w innym formularzu, tylko jak temu zaradzić, żeby mimo długiego tekstu kolumna się nie rozszerzała ?
Próbowałem też ze stylami
Kod:
<td class="k_data_przyjecia"><? echo $ddata_przyjecia ?></td>CSS:
Kod:
.k_data_przyjecia {
width: 10px;
}Oczywiście dodałem również "table-layout:fixed", lecz nie pomaga.
Możliwe, że źle sie wyraziłem.
Chodzi mi o to aby komórka była mniejsza niż jej zawartość tzn.aby na ekranie była wyświetlana tylko część jej zawartości.Cała zawartość komórki ma być wyświetlona w osobnym formularzu po jej wybraniu z tabeli.
RE: XHTML/CSS/PHP Ustawienie szerokości kolumn w tabeli. - Kartofelek - 27-02-2011
Nie da się ;]
Ogólnie zastosuj technikę div ...
<td class="k_data_przyjecia>
<div>bla bla bla</div>
</td>
.k_data_przyjecia div {width:10px; overflow:hidden;}
http://stackoverflow.com/questions/446624/table-cell-widths-fixing-width-wrapping-truncating-long-words
Pamiętam, że Riddle fajnie o tym pisał :
http://riddle.jogger.pl/2006/07/31/przycinanie-dlugich-linijek-tekstu/
Może się przyda
RE: XHTML/CSS/PHP Ustawienie szerokości kolumn w tabeli. - hghormone - 27-02-2011
Heh, właśnie zanim przeczytałem twoją podpowiedź walczyłem cały czas z "overflow:hidden" i rzeczywiście to ukrywa tak jak chciałem, pozostał mi tylko problem ze zmniejszeniem danej komórki, " width: 10px;" nie pomaga.To tak wygląda jakby pewna minimalna wartość szerokości komórki była juz ustalona i nie można zrobić, aby była mniejsza.
RE: XHTML/CSS/PHP Ustawienie szerokości kolumn w tabeli. - Kartofelek - 27-02-2011
a cellpadding i cellspacing ustawione ma? a padding i margin dla td ma?
RE: XHTML/CSS/PHP Ustawienie szerokości kolumn w tabeli. - hghormone - 27-02-2011
Czy chodzi o to ?
CSS:
Kod:
td {
padding:0px
margin: 0px}XHTML:
Kod:
<table cellpadding="0" cellspacing="2">Bo wstawiłem to,ale nie pomaga, nadal nie moge zmniejszyć rozmiaru danej kolumny.
RE: XHTML/CSS/PHP Ustawienie szerokości kolumn w tabeli. - hghormone - 27-02-2011
Udało mi się rozwiązać problem, z jednym małym ale:
XHTML:
Kod:
<?php
print '<?xml version="1.0" encoding="iso-8859-2"?>';
print '<?xml-stylesheet type="text/css" href="xhtml.css"?>';
?>
<!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">
<head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-2" />
<link rel="stylesheet" href="style.css" type="text/css" />
</head>
<body>
<?
include("polacz.php");
mysql_connect('localhost',$username,$password);
@mysql_select_db($database) or die("Nie odnaleziono bazy danych");
$query="SELECT * FROM przyjecia";
$result=mysql_query($query);
$num=mysql_numrows($result);
mysql_close();
?>
<!-- To jest miejsce na treść dokumentu -->
<table>
<caption>Serwis</caption>
<thead>
<tr>
<td class="k_pozycja">ID</td>
<td class="k_data_przyjecia">Data przyjęcia</td>
<td class="k_model">Model</td>
<td class="k_imei">Imei</td>
<td class="k_uwagi">Uwagi</td>
</tr>
</thead>
<tbody>
<?
$i=0;
while ($i < $num) {
$did_pozycja=mysql_result($result,$i,"id_pozycja");
$ddata_przyjecia=mysql_result($result,$i,"data_przyjecia");
$dmodel=mysql_result($result,$i,"model");
$dnr_imei=mysql_result($result,$i,"nr_imei");
$duwagi=mysql_result($result,$i,"uwagi");
?>
<tr>
<td class="k_pozycja"><? echo $did_pozycja ?></td>
<td class="k_data_przyjecia"><? echo $ddata_przyjecia ?></td>
<td class="k_model"><? echo $dmodel ?></td>
<td class="k_nr_imei"><? echo $dnr_imei ?></td>
<td class="k_uwagi"><? echo $duwagi ?></td>
</tr>
<?
$i++;
}
?>
</tbody>
<tfoot>
<tr>
<td colspan="5">HTML/CSS/PHP/MySQL</td>
</tr>
</tfoot>
</table>
<div style="position: absolute; left: 10px; top: 75px">
<form action="wpis.php" method="post">
<fieldset>
<legend>Edycja</legend>
<label>Data przyjęcia:</label> <input type="text" name="data_przyjecia" class='i1'><br>
<label>Model:</label> <input type="text" name="model" class='i1'><br>
<label>Nr imei:</label> <input type="text" name="nr_imei" class='i1'><br>
<label>Uwagi:</label> <input type="text" name="uwagi" class='i1' ><br>
<label></label><input type="submit" value="Wyślij" style="margin: 2px 4px 0px 4px;">
</fieldset>
</form>
</div>
</body>
</html>Kod:
h1 {
text-align: center;
}
table {
width: 40%;
margin: 0 auto;
table-layout: fixed;
}
table thead {
background: #000;
color: #fff;
}
table tbody {
background: transparent;
color: #000;
}
table tfoot {
background: #525252;
color: #fff;
text-align: right;
}
table tfoot a:link, table tfoot a:visited {
color: #fff;
text-decoration: underline;
}
table tfoot a:hover {
color: #fff;
text-decoration: none;
}
table tbody tr:hover {
background: #FFE9A0;
}
table tbody tr:nth-child(even) {
background: #EBEBEB;
}
table tbody tr:nth-child(odd) {
background: #D6D6D6;
}
table tbody tr:hover {
background: #FFE9A0;
}
label {
display: block;
width: 150px;
float: left;
margin: 2px 4px -1px 4px;
text-align: right;
}
caption {
font-size: 40px;
font-style: normal;
}
td {
padding:0px 0px;
margin: 10px
}
.i1 {
background-color:#EBEBEB;
border: 1px solid #006;
margin: 2px 4px 0px 4px;
}
.k_pozycja{
width:5% ;overflow:hidden;
}
.k_data_przyjecia{
width:17% ;overflow:hidden;
}
.k_model{
width:27% ;overflow:hidden;
}
.k_nr_imei{
width:20% ;overflow:hidden;
}
.k_uwagi{
width:35% ;overflow:hidden;
}Ogolnie wszystko jest ok, w bazie wpisanych mam 70 pozycji i wszytskie się wpisują w tabele, za długie wpisy elegancko mi przycina jeśli są za długie, z wyjątkiem 23 pozycji w której znajduje się za długi nr imei, zamiast go przyciąć to rozszerzyła mi się jedna ramka o jedną linie, zupełnie nie wiem dlaczego.W innych pozycjach też mam za długie nry imei i one sa bez problemu przycięte.Nie moge tego zrozumieć.
Już wiem w czym problem ,sprawdziłem w bazie i okazuje się, że w 23 pozycji nr imei jest wpisany ze spacją i to go rózni od innych pozycji.
Ale dlaczego tak się dzieje ? Przecież gdy np.w uwagach bedzie dlugi opis i on bedzie zawierał spacje to będzie działo się to samo.Jak poradzić sobie z tym problemem ?
RE: XHTML/CSS/PHP Ustawienie szerokości kolumn w tabeli. - Kartofelek - 28-02-2011
Ale twarda spacja czy spacja miękka? Bo to różnica. Może po prostu nie potrafi zawinąć.
Wystaw na sieci, wtedy się zobaczy.
Co to?
<?php
print '<?xml version="1.0" encoding="iso-8859-2"?>';
print '<?xml-stylesheet type="text/css" href="xhtml.css"?>';
?>
RE: XHTML/CSS/PHP Ustawienie szerokości kolumn w tabeli. - hghormone - 28-02-2011
A więc tak, jeśli chodzi o spacje to nie wiem czy to twarda spacja czy spacja miękka, po prostu zwykła spacja używana podczas wpisywania do input-a
.Wiem, że to śmiesznie brzmi, ale naprawdę jestem początkującym, ale chętnym do nauki.
Jeśli chodzi o zamieszczenie w necie to postaram się to niedługo zrobić,bo na chwilę obecną tworze wszystko na wirtualnym serwerze XAMPP i wszystko chciałem przenieść po zakończeniu projektu.
Co do:
Kod:
<?php
print '<?xml version="1.0" encoding="iso-8859-2"?>';
print '<?xml-stylesheet type="text/css" href="xhtml.css"?>';
?>Na razie korzystam z "Pajączka", bo on ułatwia mi naukę.Podczas tworzenie nowego projektu projektu mam do wyboru coś takiego jak "Deklaracja typu dokumentu (według specyfikacjiW3C)" i ja zawsze wybieram pozycje:
Kod:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">.Wracając do tematy po wybraniu pozycji o której pisałem wyżej, zmieniam nazwę pliku z .html na .php, ponieważ będę korzystał ze skryptów "php" na mojej stronie (z tego co wyczytałem w necie tak należy zrobić), ale pojawia się właśnie problem gdy chce uruchomić plik z tą stroną, a robię to np. w taki sposób "localhost/Tabela.php", ale mimo wszystko próba uruchomienia takiego pliku kończy się niepowodzeniem i informacją o błędach w pierwszych liniach, więc po poszukiwaniach w necie wyczytałem, że początek należy zmienić na formę:
Kod:
<?php
print '<?xml version="1.0" encoding="iso-8859-2"?>';
print '<?xml-stylesheet type="text/css" href="xhtml.css"?>';
?>Standardowo forma przed zmianą wygląda tak:
Kod:
<?xml version="1.0"?>
<!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">Dopiero po zmianie udaje mi się uruchomić stronę.
Byłoby fajnie jeśli pomógłbyś mi ze zrozumieniem błędów jakie popełniam
.