Forum PHP.pl > tabela w tabeli, problem z"width"

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: tabela w tabeli, problem z"width"

Forum PHP.pl > Forum > Po stronie przeglądarki > CSS

szamanpl0

2.08.2007, 19:08:04

Witam

Piszę stronę w PHP w której dane są pobierane z bazy SQL-a, z CSS zaczynam dopiero swoją przygodę i natrafiłem na problem, utworzyłem w css główną tabelę a w niej kolejne tabele z elementami, przy polu data chciałem żeby tylko ono zajmowało 70% długości tego wiersza a pole autor resztę długości wiersza, lecz przy dokonaniu tej zmiany ustawiła się cała ta kolumna tabeli na 70% i nie wiem jak to zrobić żeby długość zmieniała się tylko tego wiersza a nie całej kolumny. Prosił bym o pomoc z tym.

Fragment kodu php w którym ustawiam tabele:

[PHP] pobierz, plaintext 
<?php
$glownatabela=<<<ABC
<div id="tabelanowosci">
 
 
ABC;
$glownatabeladane = '';
while ($row = mysql_fetch_array($wynik)) {
  $nowosci_numer = $row['nowosci_numer'];
  $nowosci_tytul = $row['nowosci_tytul']; 
  $nowosci_tresc = $row['nowosci_tresc'];
  $nowosci_kategoria = $row['nowosci_kategoria'];
  $nowosci_data = $row['nowosci_data'];
  $nowosci_autor = $row['nowosci_autor'];
  $nowosci_zrodlo = $row['nowosci_zrodlo'];
 
kategoria();
 
  $glownatabeladane .=<<<ABC
 
<div id="wiersz">
	<div class="nowosci_tytul">$nowosci_tytul</div>
</div>
<div id="wiersz">
	<div class="nowosci_data">$nowosci_data</div>
	<div class="nowosci_autor"> Autor/Wstawil $nowosci_autor</div>
</div>
<div id="wiersz">
	<div class="nowosci_tresc">$nowosci_tresc</div>
</div>
<div id="wiersz">
	<div class="nowosci_kategorian">Kategoria:</div>
	<div class="nowosci_kategoriaz">$kategoria</div>
</div>
<div id="wiersz">
	<div class="nowosci_zrodlon">Zrodlo</div>
	<div class="nowosci_zrodloz">$nowosci_zrodlo</div>
</div>
 
 
ABC;
}	 
 
 
$glownastopka ="</div>";
?>
[PHP] pobierz, plaintext

a to mój plik z stylem

Kod

/*Nowosci style*/
#tabelanowosci {
    display: table;
    border-spacing: 1px;
    border: 1px solid black;
    width: 70%;
}

#wiersz {
    display: table-row;
    border-spacing: 1px;
    border: 1px solid black;
}
.nowosci_tytul {
    display: table-cell;
    border-spacing: 1px;
    border: 1px solid black;
}

.nowosci_data{
    display: table-cell;
    border-spacing: 1px;
    border: 1px solid black;
    width: 70%;
}

.nowosci_autor{
    display: table-cell;
    border-spacing: 1px;
    border: 1px solid black;
    width: 30%;
}

.nowosci_tresc{
    display: table-cell;
    border-spacing: 1px;
    border: 1px solid black;
}

.nowosci_kategorian{
    display: table-cell;
    border-spacing: 1px;
    border: 1px solid black;
}

.nowosci_kategoriaz{
    display: table-cell;
    border-spacing: 1px;
    border: 1px solid black;
}
.nowosci_zrodlon{
    display: table-cell;
    border-spacing: 1px;
    border: 1px solid black;
}

.nowosci_zrodloz{
    display: table-cell;
        border-spacing: 1px;
    border: 1px solid black;
}

Z góry dziękuje za pomoc

harek

2.08.2007, 23:39:32

[HTML] pobierz, plaintext 
<div id="wiersz">
    <div class="nowosci_tytul">$nowosci_tytul</div>
</div>
<div id="wiersz">
    <div class="lewa">$nowosci_data</div>
    <div class="prawa"> Autor/Wstawil $nowosci_autor</div>
</div>
<div id="wiersz">
    <div class="nowosci_tresc">$nowosci_tresc</div>
</div>
<div id="wiersz">
    <div class="lewa">Kategoria:</div>
    <div class="prawa">$kategoria</div>
</div>
<div id="wiersz">
    <div class="lewa">Zrodlo</div>
    <div class="prawa">$nowosci_zrodlo</div>
</div>
[HTML] pobierz, plaintext

CSS : trochę uprościłem ale myślę że załapiesz o co chodzi i dopasujesz do siebie ...

[HTML] pobierz, plaintext 
#tabelanowosci {
    display: table;
    border-spacing: 1px;
    border: 1px solid black;
    width: 70%;
}
 
#wiersz {
    display: table-row;
    border-spacing: 1px;
    border: 1px solid black;
    width: 100%;
}
.nowosci_tytul {
    display: table-cell;
    border-spacing: 1px;
    border: 1px solid black;
    width: 100%;
}
 
 
.nowosci_tresc{
    display: table-cell;
    border-spacing: 1px;
    border: 1px solid black;
    width: 100%;
}
 
.lewa {
width: 70%;
float: left;
}
 
.prawa {
width: 30%;
float: right;
}
[HTML] pobierz, plaintext

szamanpl0

3.08.2007, 08:31:46

Dziękuje bardzo za pomoc, tym bardziej że napisałem ten post jeszcze na 2 innych forach i nikt mi nie udzielił odpowiedzi.

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.