Discussion :

[UoLad]

Bonjour,

Débutant en CSS, je ne parviens pas à me faire respecter : Je place un textebox dans une zone menu, à sa droite une imagebutton pour lancer l'extraction des données en fonction de la saisie dans le textbox. Ma question, pourquoi le control textbox cherche systematiquement à occuper toute la place dont il dispose? voici le code de ma masterpage:
CSS :
.Mnugauche
{
border-style: outset;
border-color: #0000FF;
background-color: #008080;
margin-left: auto;
position: relative;
left: 0px;
float: left;
height: 100%;
width: 200px;
top: 10px;
}
.txt
{
width:7em;
}

HTML :
<!-- Zone de navigation gauche -->
<div class="Mnugauche" align="left">
<!-- Zone Espace membre -->
<aspanel ID="Panel1" BorderColor="Beige" runat="server" DefaultButton="imCmdLookEAB" >
<h1>Analyse d'un EAB</h1>
<asp:TextBox ID="txtEAB" Columns="5" Font-Bold="True" runat="server" CssClass="txt">
EAB
</asp:TextBox>

<asp:ImageButton ID="imCmdLookEAB" runat="server" PostBackUrl="~/wfEAB.aspx"
ToolTip="Lancer l'extraction des données..." ImageUrl="~/App_Themes/Default/Images/Search.gif"/>
</aspanel>
<hr />
ligne</h2>
</div>

[HiRoN]

Tu peux toutefois mettre directement la taille de ta textbox en dur dans le code (sans CSS donc)...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<asp:TextBox ID="TextBox1" Width="100px" runat="server"></asp:TextBox>

Pourquoi vouloir gérer la taille de la TextBox via du css ?
Il est, pour ma part, plutôt rare d'avoir à retoucher ce genre de choses une fois que c'est défini...
Mais bonne question, je ferai des tests sous peu sur le sujet...

[UoLad]

Merci HiRon,

Ta réponses est la solution par laquelle j'avais commencé, sans résultat, d'où mes essais avec du CSS. Je me demande si le textbox qui est à l'intérieur de la <div class="Mnugauche" align="left"> n'est pas influencé par le style Mnugauche??

En tout cas ceci ne fonctionne pas mieux :
<div class="Mnugauche" align="left">
<!-- Zone Espace membre -->
<h1>Analyse d'un EAB</h1>

<asp:TextBox ID="txtEAB" Columns="5" Font-Bold="True" runat="server" Width="40px">
EAB
</asp:TextBox>

<asp:ImageButton ID="imCmdLookEAB" runat="server" postBackUrl="~/wfEAB.aspx"
ToolTip="Lancer l'extraction des données..." ImageUrl="~/App_Themes/Default/Images/Search.gif"/>
<hr />
</div>

Je cherche tjs, sis qqun à une idée...

[HiRoN]

En effet, la TextBox est influencé par le style appliqué au menu.

En faisant :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
 <asp:TextBox ID="TextBox1" CssClass="cssTest" runat="server"></asp:TextBox>

Et

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

.cssTest { width:300px; }

La TextBox prend bien la taille défini via le css...

As-tu essayé :

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
.Mnugauche input { width:200px; }

?

[UoLad]

Heu, non, je ne vois pas bien là. Je met ou le input? car, en fait, mon style Mnugauche doit s'appliquer à la div, et dans cette div, je place un textbox.

Désolé, mais je ne comprend pas bien ta réponse

[HiRoN]

Pas vraiment le temps d'expliquer...

Sinon, tu peux faire :

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
<span class="cssTest">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</span>

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

.cssTest input { width:500px; }

Tu met donc la TextBox dans un span auquel tu appliques un style.
Le "input" permet de spécifier que le style s'appliquera au élément de type input contenu dans le span de classe "cssTest".

[UoLad]

Arf. Pareil. il s'en fou do mon Width
Mais merci qq meme

[UoLad]

G trouvé: en fait je démare mon appli en appuis avec les fichier du coach ASP.net. J'ai donc récupérer le fichier "default.skin" dans lequel j'ai trouvé ceci :
<asp:TextBox runat="server" BackColor="transparent" valign="middle" border="1px solid #929292" width="140px" height="15px" ForeColor="#003063"></asp:TextBox>

En passant à 40px, ca va beaucoup mieux...

Merci qq meme à toi, je penses qur tu auras d'autres occasion de m'éclairer...

[HiRoN]

Bon...

J'ai repris ton code :

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
<div class="Mnugauche" align="left">
<span class="cssTest">
<asp:TextBox ID="txtEAB" Columns="5" Font-Bold="True" runat="server">EAB</asp:TextBox>
</span>
</div>

Avec ta classe .Mnugauche

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 
.Mnugauche
{
border-style: outset;
border-color: #0000FF;
background-color: #008080;
margin-left: auto;
position: relative;
left: 0px;
float: left;
height: 100%;
width: 200px;
top: 10px;
}
 
.cssTest input { width:150px; }

Cela fonctionne pourtant nikel chez moi (testé FF2/3 & IE7)

[HiRoN]

G trouvé: en fait je démare mon appli en appuis avec les fichier du coach ASP.net. J'ai donc récupérer le fichier "default.skin" dans lequel j'ai trouvé ceci :
<asp:TextBox runat="server" BackColor="transparent" valign="middle" border="1px solid #929292" width="140px" height="15px" ForeColor="#003063"></asp:TextBox>

En passant à 40px, ca va beaucoup mieux...

Hmm... Donc tu as modifier la valeur en dur ? Ou alors tu m'as perdu... (bis)
Passe alors le sujet en Résolu si c'est Ok...