Psizionamento Label e input

giovedì 04 gennaio 2007 - 23.41

squilibrio Profilo | Expert

Ciao a tutti, ho dei problemi nella creazione di un'area di inserimento con

label (incolonnate) - campo inserimento

nella prima riga della mia area di inserimento, dovrei avere

label - radio button - input - listbox (tutti sulla stessa riga e tutti accanto)

nella seconda

label (incollanata con quella sopra) - input (incolonnato col radio sopra)



in pratica è come se dovessi realizzare una tabella a due colonne (label e area di inserimento)

io ci ho provato ma gli elementi nella prima riga risultano distaziati.


Dato che il codice HTML generato dai componenti .NET è parecchio "sporco" ho preferito postare il codice HTML con gli oggetti .NET, per semplificare la logica

Non ho particolari esigenze, vorrei adottare la soluzione piu semplice per "incolonnare" gli elementi ma che allo stesso sia adattabile per altre situazioni e in altri contesti (utilizzando la stessa struttura di fogli stile, simile a quella che ho provato a creare) che fanno uso di altri CSS


Grazie per l'aiuto!


div class="page" id="insert">
<div class="insert-area">
<asp:Label ID="tbDestinatario" runat="server" AssociatedControlID="ddlDestinatario">Destinatario:</asp:Label>
<asp:TextBox ID="tbFindDestinatario" runat="server" CssClass="find"></asp:TextBox>
<asp:RadioButtonList ID="RadioButtonList1" runat="server" RepeatDirection="Horizontal" TextAlign="Left">
<asp:ListItem Selected="True">ID</asp:ListItem>
<asp:ListItem>Nome</asp:ListItem>
</asp:RadioButtonList>
<asp<img src="images/smilies/biggrin.gif" border="0" alt="">ropDownList ID="ddlDestinatario" runat="server">
</asp<img src="images/smilies/biggrin.gif" border="0" alt="">ropDownList>
</div>
<div class="insert-area">
<asp:Label ID="lblNome" runat="server" AssociatedControlID="tbOggetto">Oggetto:</asp:Label>
<asp:TextBox ID="tbOggetto" runat="server" CssClass="input"></asp:TextBox>
<asp:RequiredFieldValidator ID="NomeRequired" runat="server" ControlToValidate="tbOggetto"
ErrorMessage="Data non corretta." ToolTip="" ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator>
</div>



</div>





div#insert {
width: 520px;
text-align: center;
margin: 0 auto;
}

div#insert .insert-area {
width: 520px;
height: 20px;
padding: 2px;
margin: 0 auto;
}

div#insert label {
float: left;
text-align: right;
display: block;
width: 70px
}

div#insert .input {
margin-left: 10px;
width: 180px;
float: left;
}

div#insert .find {
margin-left: 10px;
width: 70px;
float: left;
}

div#insert select {
margin-left: 10px;
font: 11px verdanaa, arial, helvetica, sans-serif;
color: #666666;
float: left;
}

trasportation Profilo | Junior Member

Per utilizzare i div in un'impaginazione di questo tipo impaginazione ti consiglio di impostare un stile per label che determina la larghezza della stessa, tutti i controlli li allinei (float) a destra ed a ogni controllo imposti una larghezza.

Eccoti un'esempio:

<div style="clear:both;"><!-- prima riga -->
<div style="float:left;width:200px">Mia etichetta</div>
<div style="float:left;">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox></div>
<div style="float:left;width:200px">Mia etichetta 2</div>
<div style="float:left;">
<asp:RadioButtonList ID="RadioButtonList2" runat="server" RepeatDirection="Horizontal" TextAlign="Left">
<asp:ListItem Selected="True">ID</asp:ListItem>
<asp:ListItem>Nome</asp:ListItem>
</asp:RadioButtonList>
</div>
</div>
<div style="clear:both;"><!-- seconda riga -->
<div style="float:left;width:200px">Mia etichetta 3</div>
<div><asp:TextBox ID="TextBox2" runat="server"></asp:TextBox></div>
</div>

Se usi questo tipo di formattazione senza tabelle suppongo che sia dovuto al fatto che la tua pagina deve essere conforme alla lege stanca (o cose del genere), se è così il tuo form non risulta comunque conforme per via del tipo di impaginazione scelto (almeno secondo la mia esperienza).

Spero di esserti stato utile e di aver capito il tuo problema

R.
/*
* web: http://www.robertobeccari.it
*/
Partecipa anche tu! Registrati!
Hai bisogno di aiuto ?
Perchè non ti registri subito?

Dopo esserti registrato potrai chiedere
aiuto sul nostro Forum oppure aiutare gli altri

Consulta le Stanze disponibili.

Registrati ora !
Copyright © dotNetHell.it 2002-2023
Running on Windows Server 2008 R2 Standard, SQL Server 2012 & ASP.NET 3.5