[HTML] [PHP] dividere lo schermo in tre colonne

paperinik4

Utente Attivo
29 Mag 2011
1.812
0
36
Roma
www.ricetteagogo.it
Salve a tutti,

Purtroppo devo riaprire una vecchia discussione a cui non ne sono venuto a capo. Ho l'intestazione in tre punti dello schermo ossia la data al margine sx, l'intestazione al centro, e a dx un vuoto in bianco che dovrà essere riempito ancora non so da coso, e una riga in orizzontale tracciata con il tag <hr>. Il mio problema è il seguente: devo dividere questi tre spazi con una riga in verticale che parte dalla riga orizzontale fino a giù. Come posso fare ??? Cerco di allegarvi un prospetto per capire il tutto. Eccollo, dove ci sono le interruzioni devono partire le righe in verticale fino a giù. Grazie a tutti dell'aiuto.

Intestazione_con_riga.png
 

cris8380

Moderatore
Membro dello Staff
MOD
3 Giu 2016
261
14
18
37
Ciao scusa il ritardo sei stato spostato in questa sezione ti posto quello che ti serve.
HTML:
<hr style="layout-flow: vertical-ideographic; width:2px; height:100px; position: relative; top: -220px;" >

ovviamente lo adatti alla tua pagina.

Buona giornata e a presto.
 
  • Like
Reactions: Jonn and paperinik4

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.388
338
83
Se i tuoi 3 spazi sono 3 div cosa che non ci dici, puoi anche usare tranquillamente i bordi "border"
 
  • Like
Reactions: paperinik4

paperinik4

Utente Attivo
29 Mag 2011
1.812
0
36
Roma
www.ricetteagogo.it
Ciao Max1,

Non ho specificato se sono div perchè non ho la più pallida idea. Tanto per farti capire meglio cosa vorrei ottenere. Non so se ti ricordi il vecchio stile di fb che aveva diviso in tre colonne ??? Ecco una cosa del genere. Ovviamente senza violare il copywrite.
 

cris8380

Moderatore
Membro dello Staff
MOD
3 Giu 2016
261
14
18
37
Un consiglio crea una tabella del tipo
HTML:
<table>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>

nel caso di problemi siamo qui
 
  • Like
Reactions: paperinik4

cris8380

Moderatore
Membro dello Staff
MOD
3 Giu 2016
261
14
18
37
Precisamente così
HTML:
<table  style="width:100%" border="1" >
<tr>
<td>01/07/2016</td>
<td>Benvenuti nel modulo d'iscrizione</td>
<td>&nbsp;</td>
</tr>
</table>
 
  • Like
Reactions: paperinik4

cris8380

Moderatore
Membro dello Staff
MOD
3 Giu 2016
261
14
18
37
Se nel caso hai bisogno non esitare a postare qui la tua risposta, cerca di creare tu un codice personalizzato e lo posti per darti ulteriori chiarimenti.

Ti saluto.
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.388
338
83
Si può fare anche come ha detto Cris ma è una soluzione obsoleta e non semantica. Le tabelle servono per dati tabellari ma non per costruire layout che fra l'altro poi ti lamenteresti per i problemi su mobile.
I layout vogliono fatti con i div!
Usa 3 div posizionati con float e tra i bordi come separatori.
Poi come ha detto Cris se ha problemi posta il codice che vediamo di sistemarlo
 
  • Like
Reactions: Jonn and paperinik4

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.388
338
83
Ci sono esempi a volontà basta una piccola ricerca con layout a 3 colonne o simile!
Io ti rispondo da mobile e non posso fare grandi ricerche per aiutarti ma se per mercoledì non hai risolto ti faccio io il codice.
Abbi fede che a metà settimana risolviamo
 
  • Like
Reactions: paperinik4

paperinik4

Utente Attivo
29 Mag 2011
1.812
0
36
Roma
www.ricetteagogo.it
Grazie della tua disponibilità. Purtroppo mi ricordo che avevo già risolto una volta ed ora vattela a pesca dove sta la soluzione. Comunque anche i o non sto con le mani in mano. Proverò a fare delle ricerche da te suggerite. Grazie della disponibilità.
 

paperinik4

Utente Attivo
29 Mag 2011
1.812
0
36
Roma
www.ricetteagogo.it
Salve a tutti,

Allora finalmente ho trovato qualcosina. Ma bisogna adattarla cosa che non ci sono riuscito purtroppo. Questo è lo spezzone di codice:

PHP:
.colsx{
border-right:1px solid #fff;
 }
 .coldx{
 border-left:1px solid #fff;
 }

Il risultato è il seguente:

Immagine_della_pagina.png


Chiedo aiuto per poterla sistemare come da prima immagine che ho postato.

P.S.: Faccio una richiesta che nessuno ancora mi ha risposto. Dove sono i vecchi tag sul forum che c'erano prima ??? Non riesco a trovarli. Grazie a tutti.
 

cris8380

Moderatore
Membro dello Staff
MOD
3 Giu 2016
261
14
18
37
Buongiorno carissimo, ho creato un po di codice te lo posto provalo e vediamo cosa succede prova a creare un po di css se ne caso non ci riesci posta sempre nella stessa sezione.
HTML:
<div class="riga">
<div class="colonna-1">
<header>
QUI INSERISCO L'INTESTAZIONE COME DESCRITTA NELL'IMMAGINE POI FORMATTO IL TUTTO CON CSS
</header> 
</div>
</div>

<div class="riga">
<div class="colonna-1-2">
<p><img src="img/img.png" class="IMG" alt=""></p>
</div>
<div class="colonna-1-2">
<p><img src="img/img.png" class="IMG" alt=""></p>
</div>
</div>

<div class="riga">
<div class="colonna-1-3">
<p><img src="img/img.png" class="IMG" alt=""></p>
</div>
<div class="colonna-1-3">
QUI METTO METTO QUELLO CHE MI PIACE 
</div>
<div  class="colonna-1-3">
ANCHE QUI OVVIAMENTE :-)
</div>
</div>

<div class="riga">
<div class="colonna-1">
<footer>
QUI ALLO STESSO MODO INSERISCO IL FOOTER 
</footer>
</div>
</div>
 
  • Like
Reactions: paperinik4

cris8380

Moderatore
Membro dello Staff
MOD
3 Giu 2016
261
14
18
37
Ti posto un codice completo incollato su un documento di testo e salvalo con l'estensione .html (es. index.html) e vedi se ti piace.
HTML:
<!DOCTYPE html>
<head>
<style>
#header {
    background-color:black;
    color:white;
    text-align:center;
    padding:5px;
}
#nav {
    line-height:30px;
    background-color:#eeeeee;
    height:300px;
    width:100px;
    float:left;
    padding:5px;
}
#section {
    width:350px;
    float:left;
    padding:10px;
}
#footer {
    background-color:black;
    color:white;
    clear:both;
    text-align:center;
    padding:5px;
}
</style>
</head>
<body>

<div id="header">
<h1>MODULO D'ISCRIZIONE DI PAPERINIK4</h1>
</div>

<div id="nav">
Iscizioni<br>
Iscrizioni1<br>
Iscrizioni2
</div>

<div id="section">
<h2>Iscrizioni</h2>
<p>In questa sezione scrivo cio che mi piace </p>
<p>qui posso inserire immagini e altro come mi pare e piace :-)</p>
</div>

<div id="footer">
paperinik4 - tutti i diritti sono riservati...
</div>
</body>
</html>

dai che fino alla fine vinceremoo :p:p:p:p:p:p;);)
 
  • Like
Reactions: paperinik4

paperinik4

Utente Attivo
29 Mag 2011
1.812
0
36
Roma
www.ricetteagogo.it
Ciao cris8380,

Mancano solo le righe in verticale. Perchè sennò andrebbe pure bene :p sono quelle che mi fanno disperare. Ho ottenuto una cosa del genere però ancora none ra quello che volevo io:






A lato anche se non si vede c'è una riga....
Immagine_della_pagina.png
 

cris8380

Moderatore
Membro dello Staff
MOD
3 Giu 2016
261
14
18
37
ma quindi queste righe in verticale dove dovrebbe apparir? come sono vedo nell'immagine? affianco a secondo footer ? fammi sapere perche tra un po vado via.
 
Discussioni simili
Autore Titolo Forum Risposte Data
M Collegamento tra form html e script php PHP 4
L Ricezione dei dati su file php da modulo html PHP 6
C Dopo chiusura del tag php la stringa html va a capo PHP 1
A inserire variabile php colore in div html PHP 2
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
Z Mod_rewrite da HTML in PHP PHP 3
C [RISOLTO]Inserimento variabile php in input html PHP 20
C Risalire al php da html PHP 27
webmachine [PHP] [JAVASCRIPT] Form strano in HTML PHP PHP 1
F [PHP] Form html PHP 2
G FORM HTML E PHP PHP 0
F [PHP] [HTML] Tabella cambia pagina responsive PHP 8
M [PHP] [HTML] Centrare in verticale un pulsante in una tabella PHP 3
M [PHP] Istruzione "echo" all'interno di codice html PHP 2
F [PHP] Importare file CSV in HTML PHP 12
T [PHP] [HTML] Dettagli che cambiano PHP 5
M [PHP] Come inserire codice html in un ciclo while PHP 2
T con oop creare un ciclo per una pagina dinamica html con php PHP 3
F [PHP] [HTML] Formmail PHP 0
ANDREA20 [PHP] [HTML] crea form di contatto PHP 4
D [PHP] [HTML] Pagina con permessi amministratore PHP 6
L [Wordpress]Precedenza Index.php a Index.html WordPress 1
Angelo Russo [PHP] [HTML] form contatti PHP 0
F [PHP] Importare file CSV in HTML PHP 3
C [PHP] Pagina html che legge file txt PHP 41
GiErre [PHP] [HTML] Disabilitare un link in funzione della piattaforma PHP 7
Y [PHP] [HTML] Modificare i quadranti PHP 1
F [PHP] [HTML] File legato ad action in un form PHP 1
T [PHP] [HTML] Action direttamente associate a onmouseover PHP 11
A [PHP] Inserimento url dinamici in pagina html PHP 3
Y [PHP] [HTML] Pagina referenti PHP 5
trattorino [PHP] [HTML] redirect iniezione su firefox PHP 5
D Come intrecciare PHP all'HTML PHP 1
S [PHP] [HTML] Come creare un grafico dinamico PHP 4
A [Retribuito][Offro] Restyling grafico portale PHP/HTML Offerte e Richieste di Lavoro e/o Collaborazione 0
andreas88 [PHP] [HTML] Pagina preventivi form contatti PHP 5
A [PHP] Formattazione Mail HTML HTML e CSS 5
J [PHP] [HTML] Trasferire dati da un form ad un dominio diverso. PHP 3
D [PHP] [RETRIBUITO] cercasi esperto programmatore per realizzare applicazione in html e codice iframe PHP 0
R [PHP] Problema stampa array bidimensionali con formula $html.=<<<myHtml... PHP 2
M [wordpress-galleria immagini]Inserire classe php in html PHP 0
F [PHP] [HTML] Redirect Complicato PHP 5
V Passare a PHP pagina bootstrap creata in HTML PHP 1
Y Performance html/php vs php/html PHP 2
Shyson [HTML] Spostare a sinistra codice php PHP 6
trattorino [PHP] [HTML] problema form PHP 1
G [PHP] [HTML] Sito web URL e altro PHP 3
G Siti web URL e altro (PHP, HTML) Presentati al Forum 1

Discussioni simili