Div a due colonne in una tabella

**pati** · 10-03-2021, 14:44

Buongiorno al forum! Non riesco a risolvere un problema. Ho un div a due colonne inserito in una tabella. Il div container ha la stessa larghezza della tabella e le due colonne devono essere uguali. Ma la colonna di sinistra viene staccata dal bordo di sinistra mentre quella di destra va al bordo a destra.
Questo è il codice:

codice HTML:

div#container{    width: 900px;    font: 76% georgia,serif;	border: 1px;	margin: 0 auto;    }div.split2 div{	float: left;    w\idth: 50%;	w\idth: 50%;
    padding: 0 0%;	text-align: left;	border: 1;	margin: 0 auto;    }div.wide{    clear: left; padding: 0 0%    }	div.clearer{    float: none; clear: left    }

Dove sbaglio? Grazie!!

**Vincent.Zeno** · 11-03-2021, 21:09

non si capisce niente.
posta il codice completo.

**pati** · 12-03-2021, 16:21

Spero di essere più chiara, scusate

codice HTML:

<head>
<style type="text/css">
div#container{    
width: 100%;    
border: 1;    
margin: 0 auto;    
}

div.split2 div{    
float: left;    
w\idth: 50%;    
w\idth: 50%;    
padding: 0 0 0 0;    
text-align: left;    
}

div.wide{    
clear: left;    
}    

div.clearer{    
float: none; 
clear: left;    
}    

</style>
</head>


<body>
<div class=”split2″>
    <div>
       
        <p>Testo </p>
    </div>
    <div>
        <p>Testo2</p>
    </div>
    <div class=”clearer”> </div>
</div>


</body>

**pati** · 12-03-2021, 16:52

Chiedo scusa, posto di nuovo il codice perchè era sbagliato!
<head>
<style type="text/css">
div#container{
width: 100%;
border: 1;
margin: 0 auto;
}

div.split2 div{
float: left;
w\idth: 50%;
w\idth: 50%;
padding: 0 0 0 0;
text-align: left;
}

div.wide{
clear: left;
}

div.clearer{
float: none;
clear: left;
}

</style>
</head>

<body>

<table width="900" border="0" align="center">
<div id="container">
<div class=”split2″>
<div>

<p>Testo </p>
</div>
<div>
<p>Testo2</p>
</div>
<div class=”clearer”> </div>
</div>
</table>

</body>

codice HTML:

**ninja72** · 12-03-2021, 17:36

non so se ho capito bene.

codice:

<!DOCTYPE html>
<html lang="it-IT">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

    <style>
        div#container {
            display: flex;
            width: 100%;
            border: 1px solid black;
        }

        .w-50 {
            border: 1px solid black;
            width: 50%;
            padding: 0;
        }

    </style>
</head>

<body>
    <div id="container">
        <div class="w-50">
            <p>Testo </p>
        </div>
        <div class="w-50">
            <p>Testo2</p>
        </div>
    </div>

</body>

</html>

**Vincent.Zeno** · 12-03-2021, 19:02

forse la risposta di ninja esaurisce i tuoi dubbi, quindi avresti già risolto.

in ogni caso nel codice che hai postato ci sono due gravi errori.
1- non usare mai virgolette oblique, uso solo quelle verticali.
2- il tag TABLE può contenere solo i tag TR, THEAD, TBODY, TFOOT. nessun altro tipo di dato è ammesso.in sostanza non può esistere una tabella senza righe e celle (tr e td), salvo che non siano appunto le istanze di testa, corpo o piede (thead, tbody o tfoot)
https://www.w3schools.com/tags/tag_table.asp

**pati** · 15-03-2021, 11:53

Grazie mille a Ninja72 e Vincent Zeno (ho rivisto il codice nel mio file e in realtà non c'erano virgolette oblique

). Così va benissimo, il testo è allineato come volevo!
In origine, avevo inserito questo div in una tabella insieme a un campo di ricerca.
Pur commettendo un errore, come mi ha fatto notare Vincent Zeno, la ricerca funzionava.
Ora non riesco ad inserirlo. In caso tornerò a chiedere il vostro consiglio!
Grazie ancora!!

**Vincent.Zeno** · 15-03-2021, 18:56

Originariamente inviata da pati

ho rivisto il codice nel mio file e in realtà non c'erano virgolette oblique...

potrebbe dipendere dal tuo editor che non le differenza in maniera evidente?

Discussione: Div a due colonne in una tabella

Strumenti discussione

Ricerca discussione

Visualizza