[HTML] Aggiungere una tabella a fianco di altre tabelle...

rickcosto

Nuovo Utente
2 Feb 2017
3
0
1
51
Salve!
Premetto che sono completamente a digiuno di html e di come si fa in generale un sito web.
Devo fare con Bluegriffon un sito per un compito di scuola di un ragazzino e lo stavo creando per mezzo di tabelle. Dopo aver creato a sinistra del sito i pulsanti di navigazione pensavo di posizionare una tabella a destra per i contenuti. Il problema è che quando inserisco la tabella, quelle di sinistra vanno a capo e quindi non riesco ad affiancarla lasciando inalterate le altre! Per essere più chiaro allego una foto e qui sotto il codice html.
Grazie e scusate la domanda banale.

Codice:
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
<title>prova</title>
<style type="text/css">
#a1 {
text-align: center;
text-transform: uppercase;
font-size: xx-large;
color: red;
background-color: #99ffff;
}
#a2 {
text-align: center;
}
</style></head>
<body>
<table style="width: 100%; height: 136px;" border="1">
<tbody>
<tr>
<td id="a1">Energia Idroelettrica</td>
</tr>
</tbody>
</table>
<table style="width: 20%; height: 90px;" border="1">
<tbody>
<tr>
<td id="a2" style="background-color: #99ffff;">HOME</td>
</tr>
</tbody>
</table>
<table style="width: 20%; height: 90px;" border="1">
<tbody>
<tr>
<td id="a2" style="background-color: #99ffff;">STORIA<br>
</td>
</tr>
</tbody>
</table>
<table style="width: 20%; height: 90px;" border="1">
<tbody>
<tr>
<td id="a2" style="background-color: #99ffff;">CENTRALI</td>
</tr>
</tbody>
</table>
<table style="width: 20%; height: 90px;" border="1">
<tbody>
<tr>
<td id="a2" style="background-color: #99ffff;">DIFFUSIONE</td>
</tr>
</tbody>
</table>
</body>
</html>
 

Allegati

  • Cattura.JPG
    Cattura.JPG
    57,6 KB · Visite: 185
Ultima modifica di un moderatore:

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.364
338
83
Per acere delle tabelle che non si modificano automaticamente bisogna dare delle misure firre alla tabella e alle celle.
Comunque i layout fatti a tabelle oltre che non si fanno più da tanti anni non è neanche giusto farli in questo modo per tanti e ovvi motivi.
Le tabelle vanno usate per dati tabellari e non per fare pagine web.

P,S,
Oer questa volta te lo fatto io ma in seguito ti prego si usare l'appropriato tag o funzione dalla barre degli strumenti per postare del codice come da regolamento del forum che sei pregato di leggere.
Grazie
box inserisci 2.png.JPG
 

Ibernato

Utente Attivo
2 Giu 2016
70
6
8
28
Come detto da @Max 1 , non si usano più le tabelle per fare un sito web.
Se sei a digiuno di HTML e CSS allora consiglio di leggerti prima dei tutorial e poi fare il sito oppure fartelo fare da altri.
Nel forum c'è una sezione apposita nel caso in cui vuoi proporre di fartelo fare da qualcun'altro (che suppongo non lo farà gratis)
 

rickcosto

Nuovo Utente
2 Feb 2017
3
0
1
51
Grazie ragazzi per le pronte risposte e scusa Max 1 per aver postato male il codice. Provero' ad approfondire meglio l' argomento.
Grazie di nuovo. Ciao!
 

Ibernato

Utente Attivo
2 Giu 2016
70
6
8
28
@rickcosto comunque per fare quello che vuoi tu basta fare un divUno in alto, poi un divDue sotto il divUno flottato a sinistra, e un divTre alla destra del divDue aggiungendo un pò di margin =)

HTML:
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<style>
#uno{
    width:100%;
    border: 1px solid black;
    text-align:center;
    padding:10px;
}

#due{
    float:left;
    border: 1px solid black;
    margin-top:10px;
}

div#due a{
    text-decoration:none;
}

div#due > ul {
list-style-type: none;
padding:10px;
}

#tre{
border:1px solid black;
margin:10px auto;
width:500px;
height:200px;
padding:5px;
}
</style>
</head>
<body>

<div id="uno">
<b> Elettrici</b>
</div>

<div id="due">
<ul>
<li><a href="#"> Prova 1 </a> </li>
<li><a href="#"> Prova 1 </a> </li>
<li><a href="#"> Prova 1 </a> </li>
</ul>
</div>

<div id="tre">
<b> Scrivi quello che vuoi </b>
</div>

</body>
</html>
 
Ultima modifica:

rickcosto

Nuovo Utente
2 Feb 2017
3
0
1
51
Grazie Ibernato per l' interessamento. Quello che hai scritto però è per me un po' arabo. E' che, vedi, mi hanno chiesto degli amici di aiutare il proprio figlio a fare un compito di tecnica (si, non informatica, tecnica!) dove per approfondire una ricerca sull' energia idroelettrica devono fare un sito con Bluegriffon! L' hanno chiesto a me perché sanno che "smanetto" sui computer. A me in realtà piace la grafica 3d e altre cose, ma non ho competenze sull' HTML. Ho accettato di aiutarli perché pensavo di cavarmela con un po' di tutorial e chiedendo a voi esperti qualche aiutino sui forum. Confidavo inoltre sui programmi WYSIWYG. Cosa vuoi che sia, funzionerà un po' come Photoshop, "disegni" la pagina web, qualche foto di centrali qua e la, un po' di testi e vai!
Ho scoperto invece che la materia non è affatto semplice, anzi! E' complicato anche fare un sito banale come quella schifezza che ho allegato al primo post. Ho capito che per costruire pagine web non basta affatto avere "talento" grafico, ma piuttosto competenze approfondite di scrittura di codice puro. Confesso quindi di aver peccato di leggerezza, ma ormai la frittata è fatta, devo arrangiarmi in qualche modo, anche se i tempi sono ristretti.
Grazie di nuovo.
Ciao.
 

Ibernato

Utente Attivo
2 Giu 2016
70
6
8
28
@rickcosto eh si, per scrivere un pagina web c'è bisogno di conoscenze di HTML e CSS.
Sul forum noi possiamo aiutarti a correggere il codice, ma non a costruirti un sito intero.
 
Discussioni simili
Autore Titolo Forum Risposte Data
F [WordPress] [HTML] Aggiungere una pagina solo allo sticky menu WordPress 4
M aggiungere streaming audio a pagina html HTML e CSS 2
Francesco Oliviero Aggiungere comando a pulsante HTML HTML e CSS 1
trattorino [PHP] aggiungere html in un codice PHP 0
F aggiungere html in base al valore jQuery 3
A aggiungere codice html Javascript 1
L Aggiungere codice html dopo xmlhttprequest Javascript 2
G Appicazione HTML per inserimento dai in Database Access Microsoft HTML e CSS 0
W visualizzare solo file html e sottocartelle di una cartella PHP 1
C Dopo chiusura del tag php la stringa html va a capo PHP 1
G img html HTML e CSS 3
M Come fare un countdown in HTML? HTML e CSS 4
D Stampa a video in altra pagina html Database 3
A inserire variabile php colore in div html PHP 2
F Tv in html Offerte e Richieste di Lavoro e/o Collaborazione 1
N Script elenco file HTML HTML e CSS 5
L salvare codice html in mysql PHP 3
Cosina htaccess redirect 301 senza estensione html Web Server 6
E Errore di lettura php in html PHP 8
M HTML e PHP Offerte e Richieste di Lavoro e/o Collaborazione 3
C Form email php su pagina index.html? PHP 21
Shyson Meglio Javascript o HTML? Javascript 4
P inserimento icone social tramite html HTML e CSS 1
Z Mod_rewrite da HTML in PHP PHP 3
L Collegare un form html ad un database access Javascript 2
P HTML integrazione wordpress HTML e CSS 0
C [RISOLTO]Inserimento variabile php in input html PHP 20
L Eliminare estensione .html HTML e CSS 9
max1974 html in tooltip Javascript 0
C Risalire al php da html PHP 27
felino Esportare tabella HTML in PDF, quale libreria usare? Javascript 1
webmachine [PHP] [JAVASCRIPT] Form strano in HTML PHP PHP 1
L [RISOLTO] Stampa a video risultato count in html PHP 13
V Servizio design pagina web e download in self contained html file Discussioni Varie 1
F [PHP] Form html PHP 2
G Aiuto HTML, collegamento con un bottone a una <div> di un' altra pagna HTML e CSS 5
R Aiuto sito html Offerte e Richieste di Lavoro e/o Collaborazione 3
M Estrarre dati da una select HTML PHP 3
G FORM HTML E PHP PHP 0
max1974 [HTML] Columns grid on modal form HTML e CSS 0
tomorc [HTML] Problema con scroll bar (risolto) HTML e CSS 0
F [PHP] [HTML] Tabella cambia pagina responsive PHP 8
M [PHP] [HTML] Centrare in verticale un pulsante in una tabella PHP 3
S [HTML] Effetto su testo da togliere HTML e CSS 0
M [PHP] Istruzione "echo" all'interno di codice html PHP 2
D [HTML] Aiutino su costruzione tabella :) HTML e CSS 3
diamantetredici13 [HTML] link e poi link... HTML e CSS 2
P [HTML] Problema ERR_INCOMPLETE_CHUNKED_ENCODING 206 (Partial Content) con Font HTML e CSS 1
M Programmazione web HTML, CSS e JavaScript Offerte e Richieste di Lavoro e/o Collaborazione 6
A [HTML] Testo mail non visualizzabile su IOS HTML e CSS 0

Discussioni simili