Bonjour à tous,

Cela fait longtemps que je n'étais pas venu sur le forum.

Je reviens ici pour un problème que je rencontre avec mon DNN 4.5.1 et entre autre le module Events 3.3.7.

J'utilise un container avec une div en overflow à auto pour contenir un module events.

Sous firefox, cela marche nikel comme je le souhaite.

Par contre sous IE, je rencotnre un fontionnment étonnant. Ma div ce décale en fontion de la longueur du contenu de ma div. C'est à dire que plus il y a du contenu, plus elle se décale vers le bas... lien

Je voulais savoir si vous aviez rencontré ce problème ou si vous aviez une idée de comment corriger le problème.

Le code de mon container : 

<table class="container_gare_article" cellspacing="0" cellpadding="0" align="center" border="0">
  <tr>
    <td  class="gare_titre_saison" align="right">
        <dnn:ACTIONS runat="server" id="dnnACTIONS" /><dnn:ICON runat="server" id="dnnICON" /><dnn:ACTIONBUTTON1 runat="server" id="dnnACTIONBUTTON1" CommandName="AddContent.Action" DisplayIcon="True" DisplayLink="True" />&nbsp;<dnn:ACTIONBUTTON4 runat="server" id="dnnACTIONBUTTON4" CommandName="ModuleSettings.Action" DisplayIcon="True" DisplayLink="False" />&nbsp;<dnn:ACTIONBUTTON5 runat="server" id="dnnACTIONBUTTON5" CommandName="ModuleHelp.Action" DisplayIcon="True" DisplayLink="False" />
    </td>
  </tr>
  <tr>
    <td colspan="3" class="content_gare_article_saison"><div class="content_gare_article_evenements"><div class="content_padding_article" id="ContentPane" runat="server" align="center"></div></div></td>
  </tr>
</table>

.content_padding_article{
    margin:5px;
}

.content_gare_article_evenements{
    clear:both;
    top:0px;
    width: 100%;
    height : 369px;
    overflow : auto;
    overflow-x : hidden;
    background-color: #FFFFFF;
    filter:alpha(opacity=80);
    -moz-opacity:.80;
    opacity:.80;
}

.container_gare_article {
    width: 100%;
    height: 100%;
}

.content_gare_article_saison {background-image: url(images/fond/saison.jpg);}

gare_titre_saison{background-image: url(images/gare/titre_saison.jpg); background-repeat: no-repeat; width: 614px;    height: 30px;}

Voici mon fichier de détail d'un évènement : 

<%@ Control Language="vb" AutoEventWireup="false" Codebehind="EventDetails.ascx.vb" Inherits="DotNetNuke.Modules.Events.EventDetails" %>
<link href="<%= CSS() %>" type=text/css rel=stylesheet>
<DIV class="EventDetails_div_container">
    <DIV class="EventDetails_div_detail" id="EventDetails_div_detail">
    <TABLE id="Table1" cellSpacing="0" cellPadding="3" align="center" Width="100%">
        <TBODY>
            <TR vAlign="top">
                <TD class="SubHead">
                    <div class="EventDetails_titre_event" align="left"><asp:label id="lblTitle" runat="server" CssClass="Head"></asp:label>&nbsp;<asp:image id="EventImage" runat="server" Visible="False"></asp:image></div><br/>
                </TD>
            </TR>
            <TR vAlign="top">
                <!--<TD class="SubHead" vAlign="top">
                    <P align="right"><asp:label id="lblDescriptionCap" runat="server" CssClass="SubHead" resourcekey="plDescription">Description:</asp:label></P>
                </TD>-->
                <TD vAlign="top"><asp:label id="lblDescription" runat="server" CssClass="Normal" Width="100%"></asp:label></TD>
            </TR>
            <TR>
                <TD class="SubHead" vAlign="top">
                    <div align="center">
                        <asp:linkbutton id="returnButton" runat="server" CssClass="CommandButton" resourcekey="returnButton"
                            Text="Delete this item" BorderStyle="none" CausesValidation="False">
                                    Return</asp:linkbutton>&nbsp;
                        <asp:linkbutton id="editButton" runat="server" CssClass="CommandButton" resourcekey="editButton"
                            Text="Delete this item" BorderStyle="none" CausesValidation="False">Edit</asp:linkbutton>&nbsp;
                        <asp:linkbutton id="deleteButton" runat="server" CssClass="CommandButton" resourcekey="deleteButton"
                            Text="Delete this item" BorderStyle="none" CausesValidation="False">Delete</asp:linkbutton><asp:dropdownlist id="cboTimeZone" runat="server" Visible="False" Font-Size="8pt" cssclass="NormalTextBox"></asp:dropdownlist></div>
                </TD>
            </TR>
        </TBODY>
    </TABLE>
    </DIV>
</DIV>
<DIV align="center" style="display:none;">
<TABLE id="Table2" cellSpacing="0" cellPadding="3" align="center">
    <TBODY>
    <TR>
        <TD class="SubHead" vAlign="top" noWrap>
                <P align="right"><asp:linkbutton id="cmdNotify" runat="server" CssClass="CommandButton" Visible="False" resourcekey="cmdNotify"
                        Text="Delete this item" BorderStyle="none">Notify Me for this Event @</asp:linkbutton></P>
            </TD>
            <TD vAlign="top" noWrap><asp:textbox id="txtUserEmail" runat="server" CssClass="NormalTextBox" Visible="False" Width="199px"></asp:textbox><asp:regularexpressionvalidator id="RegularExpressionValidator1" runat="server" EnableClientScript="False" ValidationExpression="\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"
                    ControlToValidate="txtUserEmail" ErrorMessage="Error valid Email Address required.">Error valid Email Address required.</asp:regularexpressionvalidator></TD>
        </TR>
        <TR>
            <TD class="SubHead" vAlign="top" noWrap colSpan="2"><asp:linkbutton id="cmdvEvent2" runat="server" CssClass="CommandButton" resourcekey="cmdvEvent2"
                    Text="Delete this item" BorderStyle="none" CausesValidation="False">Export Event Information</asp:linkbutton></TD>
        </TR>
        <TR>
            <TD class="SubHead" vAlign="top" noWrap colSpan="2"><asp:linkbutton id="cmdSignup" runat="server" CssClass="CommandButton" Visible="False" resourcekey="cmdSignup"
                    Text="Delete this item" BorderStyle="none" CausesValidation="False">Enroll for this Event?</asp:linkbutton><asp:label id="lblSignup" runat="server" Visible="False" Width="310px" ForeColor="Red">You are not enrolled for this event!</asp:label></TD>
        </TR>
        <TR vAlign="top">
            <TD class="SubHead" vAlign="top" noWrap>
                <P align="right"><asp:label id="lblStartDateTime" runat="server" CssClass="SubHead" resourcekey="plStartDateTime">Start Date/Time:</asp:label></P>
            </TD>
            <TD vAlign="top" noWrap><asp:label id="lblStartDate" runat="server" CssClass="Normal" Width="300px"></asp:label></TD>
        </TR>
        <TR vAlign="top">
            <TD class="SubHead" vAlign="top" noWrap>
                <P align="right"><asp:label id="lblEndDateTime" runat="server" CssClass="SubHead" resourcekey="plEndDateTime">End Date/Time:</asp:label></P>
            </TD>
            <TD vAlign="top" noWrap><asp:label id="lblEndDate" runat="server" CssClass="Normal" Width="300px"></asp:label></TD>
        </TR>
        <TR>
            <TD class="SubHead" vAlign="top">
                <P align="right"><asp:label id="plTimeZone" runat="server" CssClass="SubHead" resourcekey="plTimeZone">Time Zone:</asp:label></P>
            </TD>
            <TD vAlign="top"><asp:label id="lblTimeZone" runat="server" CssClass="Normal" Width="300px"></asp:label>&nbsp;&nbsp;&nbsp;
            </TD>
        </TR>
        <TR vAlign="top">
            <TD class="SubHead" vAlign="top">
                <P align="right"><asp:label id="lblReccuringEvent" runat="server" CssClass="SubHead" resourcekey="plRecurring">Recurring Event:</asp:label></P>
            </TD>
            <TD vAlign="top"><asp:label id="lblEvent" runat="server" CssClass="Normal"></asp:label></TD>
        </TR>
        <TR>
            <TD class="SubHead" vAlign="top">
                <P align="right"><asp:label id="lblCategoryCap" runat="server" CssClass="SubHead" resourcekey="plCategory">Category:</asp:label></P>
            </TD>
            <TD vAlign="top"><asp:label id="lblCategory" runat="server" CssClass="Normal"></asp:label></TD>
        </TR>
        <TR>
            <TD class="SubHead" vAlign="top">
                <P align="right"><asp:label id="lblLocationCap" runat="server" CssClass="SubHead" resourcekey="plLocation">Location:</asp:label></P>
            </TD>
            <TD vAlign="top"><asp:hyperlink id="hypLocation" runat="server" CssClass="CommandButton" Target="_blank" ToolTip="Select to display map link"></asp:hyperlink></TD>
        </TR>
        <TR vAlign="top">
            <TD class="SubHead" vAlign="top" colSpan="3"><SPAN class="Normal">
                    <P><asp:panel id="Panel1" runat="server" Width="331px"><SPAN class="Normal">
                        <asp:Label id="lblCreatedBy" runat="server" resourcekey="plCreatedBy" Width="72px">Created by</asp:Label>&nbsp;
                        <asp:label id="CreatedBy" runat="server"></asp:label>&nbsp;
                        <asp:Label id="lblOn" runat="server" resourcekey="plOn">on</asp:Label>&nbsp;
                        <asp:label id="CreatedDate" runat="server"></asp:label></SPAN>
                        </asp:panel>
                    </P>
                </SPAN>
            </TD>
        </TR>
    </TBODY>
</TABLE>
</DIV>

J'espère qu'avec ces informations vous pourrez m'aider.

A bientot.

 JD 

Je viens d'essayer en délimitant ma div en px mais cela ne change rien sous IE.

Salut,

Ajoute une div clear après chaque groupe de div dont le positionnement est changé (Float, etc.).

.clear{clear:both} .left{float:left} .un{display:inline; width:30px:} .deux{display:inline; width:60px;}

<div id="wrapper"> <div class="left un">1</div><div class="left deux">2</div><div class="clear">&nbsp;</div></div>

Après ça, vérifies tes padding : IE va additionner les hauteurs et les paddings tandsique que Gecko et autres, non (Pour Ie, height = padding + height, pour Gecko, height = height quelque soit le padding.). Si besoin, défini une div avec un height, et ajoute une div à l'intérieur avec un padding.

exemple :

<div id="wrapper"> <div class="bloc"><p>Lorem Ipsum</p><p>Lorem Ipsum</p><p>Lorem Ipsum</p><p>Lorem Ipsum</p></div> </div>

#wrapper{height:15px; overflow-y:auto;}

.bloc{padding:15px 0;}

.bloc p{font-size:13px; line-height:15px;}

seb