Probleme de CSS lié à des onglets en JS

Bonjour à tous,

Je viens vers vous car je suis dans une galère pas possible. Je vais tenté de vous expliquer le problème :

Je suis intégrateur et je travail sur un site ou certaines pages comportent des onglets.
Ces onglets gérés en JS/dotnet permettent d'afficher ou non le contenu de ces différents onglets.

Le problème auquel je suis confronté est un problème de perte de marge sur des éléments "float" lorsque je switch sur les onglets.
- le switch ne recharge pas la page.
- les onglet sont masqués par défauts.

Mon problème est visible sur IE7 (partiellement) et IE6 (totalement).

Voici deux petites illustration :

état avant switch :



état après switch :



Je poste ce petit billet bien évidement dans la partie JS car lorsque mon code xhtml n'est pas placé dans les onglets le bug n'existe pas.
Je pense donc qu'il s'agit d'un problème lié au switch et donc au JS... mais sans certitude...

voici le JS sur les onglets :

function TabStrip(mainContainerId, selectedClassName, hiddenCtrlId)
{
    this.mainContainerId=mainContainerId;
    this.tabs = document.getElementById(mainContainerId).getElementsByTagName("a");
    this.subContentIds=[];
    this.selectedClassName=selectedClassName;
    this.hidden = document.getElementById(hiddenCtrlId);
}	

TabStrip.prototype=
{
    select:function(tab)
    {
        var subContentId = this.subContentIds[tab.tabIndex];
        this.expandSubContent(subContentId);
	    for (var i=0; i<this.tabs.length; i++){ 
		    var o = this.tabs[i].parentNode;

	        var _className = o.className;
	        var _pos = _className.search(new RegExp(this.selectedClassName,"i"));
	        
	        if (_pos >= 0)
	        { 
	            if (_className.length > this.selectedClassName.length)
	            {
		            _className = _className.replace(' ' + this.selectedClassName, '');
	            }
	            else
	            {
	                _className = '';
	            }
	        }

		    if (this.tabs[i].getAttribute("rel")==subContentId)
		    {
		        o.className = (_className.length == 0)? this.selectedClassName: _className + ' ' + this.selectedClassName;
		        this.hidden.value = i;
		    }
		    else
		    {
		        o.className = _className;
		    }
	    }
    },
    
    expandSubContent:function(subContentId)
    {
	        for (var i=0; i<this.subContentIds.length; i++)
	        {
		        var subContent=document.getElementById(this.subContentIds[i]);
		        if (subContent.id == subContentId)
		        {
		            subContent.style.display="block";
		            
                    if (isNecessaryToCorrectPNG() && (document.body.filters)) 
                    {
		                var ListeImg = subContent.getElementsByTagName('img');
		                if (ListeImg.length > 0)
		                {
		                    for (var iImg = 0; iImg < ListeImg.length; iImg++)
		                    {
		                        var imgName = ListeImg[iImg].src.toUpperCase();
		                        if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
                                {
                                    Correct_Unique_Png(ListeImg[iImg]);
                                    iImg = iImg - 1
                                }
                            }
		                }
		            }
		        }
		        else
		        {
		            subContent.style.display = "none";
		        }
	        }
    },
        
    init:function()
    {
        for (var i=0; i<this.tabs.length; i++){
            var tabContainer=this;
            this.subContentIds[i]=this.tabs[i].getAttribute("rel");
            this.tabs[i].tabIndex=i;
            this.tabs[i].onclick=function(){
				        tabContainer.select(this);
					    return false;
            }
        }
        if (this.hidden.value == '') this.hidden.value = "0";
        this.select(this.tabs[this.hidden.value]);
    }
}

Si vous avez une petite idée sur le sujet ou des questions je suis à vous !!

merci à tous, [/i][/i][/i][/i][/i][/i][/i]
Modifié par GreFF (28 Nov 2008 - 17:58)

Personne n'a une petite idée ?
Besoin d'un peu plus d'info peut être ?