da tabella a due div

**pietro09** · 25-10-2011, 15:53

codice:

    <div id="div_dati" style="background-color:red; width:100%; height:100px; overflow:auto; ">
        <table border="1" style="width:100%; height:100%;">
            <tr>
                <td>
                    <div style="color:White; background-color:Green; margin:4px; " >
                        Risultati

                        <%for i = 1 to 3 %>
                            <%=i%>

                        <%next %>
                    </div>
                </td>
                <td style="width:300px;">
                    <div style="background-color:Blue;color:White; margin:4px; ">
                        cerca comuni
                    </div>
                </td>
            </tr>
        </table>
    </div>

volevo trasformare questa tabella a due colonne utilizzando due <div>

questa tabella occupa il 100% del contenitore, con la seconda colonna di larghezza fissa

mi dareste una mano?

**carlomarangoni** · 25-10-2011, 16:14

codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>Documento senza titolo</title>
		<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
		<style type="text/css">.div-1 {
	border: 1px outset #ffffff;
	height: 98px;
	position: relative;
	text-align: left;
	width: 979px;
}

.div-1-1 {
	border: 1px inset #ffffff;
	height: 90px;
	left: 3px;
	padding: 1px;
	position: absolute;
	top: 3px;
	width: 665px;
}

.div-1-2 {
	border: 1px inset #ffffff;
	height: 90px;
	left: 674px;
	padding: 1px;
	position: absolute;
	top: 3px;
	width: 300px;
}
</style>
	</head>
	<body>
		Registrato il: Jan 2002 Provenienza: Messaggi: 8755 ICQ : MSN : Skype : da tabella a due div codice:
		<div id="div_dati" style="background-color: red; width: 100%; height: 100px; overflow: auto;">
			<div class="div-1">
				<div class="div-1-1">
					<div style="background-color: green; margin: 4px; color: white; margin-top: 26px;">Risultati

</div>
				</div>
				<div class="div-1-2">
					<div style="background-color: blue; margin: 4px; color: white; margin-top: 35px;">cerca comuni </div>
				</div>
			</div>
		</div>
	</body>
</html>

**pietro09** · 25-10-2011, 16:18

ti ringrazio della risposta. Proverò appena possibile.

Un dettaglio che ho tralasciato: questa tabella che vorrei sostituire è elastica, nel senso che, se ridimensiono la finestra del browser, ne segue la larghezza.

**carlomarangoni** · 25-10-2011, 17:00

Questo dovrebbe essere elastico provalo!

La prossima volta cerca di dire tutto subito per non fare lavorare il doppio

codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>Documento senza titolo</title>
		<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<style type="text/css">
.ts-1 {
	border: 1px outset #ffffff;
	height: 98px;
	text-align: left;
	width: 979px;
}

.ts-1-1 {
	border: 1px inset #ffffff;
	clear: both;
	display: inline;
	float: left;
	height: 90px;
	margin-left: 2px;
	margin-top: 2px;
	padding: 1px;
	width: 665px;
}

.ts-1-2 {
	border: 1px inset #ffffff;
	float: left;
	height: 90px;
	margin-left: 2px;
	margin-top: 2px;
	padding: 1px;
	width: 300px;
}
</style>
	</head>
	<body>
		<div id="div_dati" style="background-color: red; width: 100%; height: 100px; overflow: auto;">
			<div class="ts-1">
				<div class="ts-1-1">
					<div style="background-color: green; margin: 4px; color: white; margin-top: 26px;">Risultati

</div>
				</div>
				<div class="ts-1-2">
					<div style="background-color: blue; margin: 4px; color: white; margin-top: 35px;">cerca comuni </div>
				</div>
				<div style="clear: both;"></div>
			</div>
		</div>
	</body>
</html>

**pietro09** · 25-10-2011, 19:09

ok, un po' di tempo per "sbollire il cervello"

e poi proverà senz'altro

Ti ringrazio, ciao

Discussione: da tabella a due div

Strumenti discussione

Ricerca discussione

Visualizza

da tabella a due div

Permessi di invio