...

View Full Version : CSS IE 7 and 6 Issue



raja19
08-20-2010, 06:14 AM
hi am making a page using Java script and pure css so far so good its working great in ie 8 and FF latest versions.But is giving me trouble with ie 6 and and Ie 7 please help me fix the css please. Thanks in advance. Am also enclosing Live demo of the page and all the css files

Regards
raja

Live Demo (http://pixelmania.sitefrost.com/new/home.html)


CSS Links

CSS-1 (http://pixelmania.sitefrost.com/new/css/css.css)
CSS-2 (http://pixelmania.sitefrost.com/new/css/datetime.css)
CSS-3 (http://pixelmania.sitefrost.com/new/css/ewebintranet.css)
CSS-4 (http://pixelmania.sitefrost.com/new/css/tabbed_browser.css)
CSS-5 (http://pixelmania.sitefrost.com/new/css/tabsets.css)

This is Mark Up :


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Verizon | NTAS Data Stewardship Process</title>
<link href="css/ewebintranet.css" type="text/css" rel="stylesheet" media="all">
<link href="css/tabsets.css" type="text/css" rel="stylesheet" media="all">
<link rel="stylesheet" type="text/css" href="css/css.css" />
<link rel="stylesheet" type="text/css" href="css/tabbed_browser.css" />
<script type="text/javascript" src="javascript/tabbed_browser.js"></script>

<script type="text/javascript" src="javascript/jquery-1.2.2.pack.js"></script>
<script type="text/javascript" src="javascript/ddaccordion.js"></script>
<script type="text/javascript" src="javascript/tablesort.js"></script>
<script type="text/javascript" src="javascript/quickLinks.js"></script>
<script type="text/javascript" src="javascript/chrome.js"></script>

</head>
<body>

<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td><div align="center" width="100%" id="sect0">
<div id="contentarea">
<div id="globalheader">
<div id="left">
<div class="logo"><img alt="Verizon" border="0" src="images/logo_secondary.gif" title="Verizon"></div>
</div>
<div id="right">
<div class="orgtitle">NTAS Data Stewardship Process</div>
</div>
<div id="globalsearch">
<div class="globalsearch_links"><strong>Quick Links</strong></div>
<div id="globalsearch_inputs_holder">
<div id="globalsearch_inputs_eDirectory">
<select class="textfields width130">
<option>-------- Select --------</option>
<option>Link 01</option>
<option>Link 02</option>
<option>Link 03</option>
<option>Link 04</option>
<option>Link 05</option>
</select>
<div class="advanced_link padTop3"><a href="javascript:void(0);" title="Help">Help</a><span class="linksPipe">|</span><a href="javascript:void(0);" title="Feedback">Feedback</a></div>
</div>
</div>
<div><a class="button_red" href="javascript:void(0);" title="Go"><span>Go</span></a></div>
</div>
</div>
<div id="globalnav" style="position:relative;">&nbsp;</div>
<div class="globalheader_shadow">
<p class="welcome_area">Welcome Guest<span>|</span><a href="javascript:void(0);" title="Sign out">Sign out</a></p>
<p class="breadcrumb">Home</p>
<div id="content">
<div id="maincontent">
<div id="middle_content_full">
<div id="maincontainer">
<div id="fillertop">
<div id="maincontenttop">
<div id="maincontenttop2">
<div class="pagetitle"><span class="header">Welcome To NTAS Data Stewardship Process</span></div>
</div>
</div>
</div>
<div id="maincontentleft">
<div id="maincontentright">
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td id="mainleft" align="left" valign="top" class="paddingRt14"><div id="maincolumn">
<!-- Main Column Content START -->
<div class="boxTop" id="boxTop">
<div class="topBoxHead1">
<h1><span class="padLt0 padRt10"><img src="images/icon_ntas.jpg" class="bdrNone" align="absmiddle"></span>Administrative Message</h1>
</div>
<div class="topBoxDivider1"></div>
<div class="topBoxHead2">
<h1><span class="padLt0 padRt10"><img src="images/icon_cal.jpg" class="bdrNone" align="absmiddle"></span>DSP Run Information</h1>
<div class="topBoxClose">
<div class="expandable_header floatLt"></div>
<div class="floatLt padLt5"><a href="javascript:void(0);" onClick="document.getElementById('boxTop').style.display='none'"><img src="images/btnClose.gif" alt="Close" title="Close" class="bdrNone"></a></div>
</div>
</div>
<br clear="all">
<div class="expandable_content">
<div class="divRow infoDiv">
<div class="width250 mrgnBtm8"><strong>NTAS DSP Version</strong></div>
<div>r1v01l12d</div>
<br clear="all">
<div class="width250"><strong>Deployed On</strong></div>
<div>Wed Jun 16 11:57:10 EDT 2010</div>
</div>
<div class="topBoxDivider2"></div>
<div class="divRow msgDiv">
<div class="width380 mrgnBtm8"><strong>Current DSP Run Set For</strong></div>
<div>12/10/2010</div>
<br clear="all">
<div class="width380 mrgnBtm8"><strong>Last Compared DSP Run</strong></div>
<div>10/10/2010</div>
<br clear="all">
<div class="width380"><strong>Oldest DSP Run</strong></div>
<div>13/09/2010</div>
</div>
</div>
</div>

<!--
<div class="tabset clrBoth" style="position:relative;">
<ul class="tab_labels padBtm2">
<li onClick="window.location='activityReport.html'"><span>Activity Report</span></li>
<li><span>Synchronizer Report</span></li>
<li onClick="window.location='lineQuery.html'"><span>Query NTAS</span></li>
<li><span>Administration</span></li>
<li><span>Security</span></li>
<li><span>Schedular</span></li>
</ul>
<div class="tabNavHome"> <a href="javascript:void(0);"><img src="images/prevTabDisabled.gif" alt="Previous Tab" title="Previous Tab" class="bdrNone"></a><a href="javascript:void(0);"><img src="images/nextTabDisabled.gif" alt="Next Tab" title="Next Tab" class="bdrNone"></a></div>
</div>
-->
<!-- Main Column Content END -->

<br clear="all">

<div class="sep"></div>

<div class="navestyle" id="navemenu">
<ul>
<li><a href="#" rel="dropmenu1" title="chaitanya's testing page">DSP Activity Report</a></li>
<li><a href="#" title="chaitanya's testing page">Syncronizer Report</a></li>
<li><a href="#" rel="dropmenu2" title="chaitanya's testing page">Query NTAS</a></li>

<li><a href="#" rel="dropmenu3" title="chaitanya's testing page">Administration</a></li>
<li><a href="#" rel="dropmenu4" title="chaitanya's testing page">Security</a></li>
<li><a href="#" title="chaitanya's testing page">Scheduler</a></li>
</ul>
</div>

<br clear="all">

<!--1st drop down menu -->
<div id="dropmenu1" class="dropmenudiv" style="width: 160px;">
<a id="dspActrptId" onclick="openTab('dspActrptId','one'); return false;" href="#" name="Activity Report" title="DSP Activity Report" ><img name="Activity Report" src = "images/1.gif" />&nbsp;DSP Activity Report</a>
</div>

<!--3rd drop down menu -->
<div id="dropmenu2" class="dropmenudiv" style="width: 185px;">
<a id="dspntastnqryId" onclick="openTab('dspntastnqryId','ntasTNLineQuery'); return false;" name="NTAS TN Line Query" href="#" title="NTAS TNQuery" ><img name="NTAS TNQuery" src = "images/1.gif" />&nbsp;NTAS TN Line Query</a>
<a id="dspntasrangeqryId" onclick="openTab('dspntasrangeqryId','ntasRANGEQuery'); return false;" name="NTAS RANGE Line Query" href="" title="NTAS RANGEQuery" ><img name="NTAS RANGEQuery" src = "images/1.gif" />&nbsp;NTAS RANGE Line Query</a>
</div>

<!--4th drop down menu -->
<div id="dropmenu3" class="dropmenudiv" style="width: 150px;">
<a id="dspexcepId" onclick="openTab('dspexcepId','dspException'); return false;" name="DSP Exception" href="" title="DSP Exception" ><img name="DSP Exception" src = "images/1.gif" />&nbsp;DSP Exception</a>
<a id="dspconfigId" onclick="openTab('dspconfigId','dspConfiguration'); return false;" name="DSP Configuration" href="" title="DSP Configuration" ><img name="DSP Configuration" src = "images/1.gif" />&nbsp;DSP Configuration</a>
</div>

<!--5th drop down menu -->
<div id="dropmenu4" class="dropmenudiv" style="width: 130px;">
<a id="searchusrId" onclick="openTab('searchusrId','searchUser'); return false;" name="Search User" href="" title="Search User" ><img name="Search User" src = "images/1.gif" />&nbsp;SEARCH User</a>
<a id="addusrId" onclick="openTab('addusrId','addUser'); return false;" name="Add User" href="" title="Add User" ><img name="Add User" src = "images/1.gif" />&nbsp;ADD User</a>
</div>


<script type="text/javascript">

cssdropdown.startchrome("navemenu")

</script>










</div></td>
</tr>
</table>
</div>
</div>
</div>




<!--
<div id="fillerbottom">
<div id="maincontentbottom">
<div id="maincontentbottom2">&nbsp;</div>
</div>
</div>

<div id="globalfooter">Copyright &copy;
<script type="text/javascript">var year=new Date(); year=year.getYear(); if (year<1900) year+=1900; document.write(year);</script>
Verizon</div>

-->


</div>
</div>
</div>
</div>
</div>
</div>
</td>
</tr>
</table>


<div id = "demoBrowser">
<div id="tabBrowser">
<div id="tabContainer">

<table><tr id="tabs"><td id="tabDemo"><div class="tabTitle"></div><div class="closeTab"><img src="images/CloseImg.gif" alt="CLOSE"></div>
</td></tr></table>
</div>
<div id="tabContent">
</div>
</div>
</div>


<div id="globalfooter">Copyright &copy;
<script type="text/javascript">var year=new Date(); year=year.getYear(); if (year<1900) year+=1900; document.write(year);</script>
Verizon</div>


<!--
<div id="demoBrowser">
<div id="tabBrowser">
<div id="tabContainer">
<ul id="tabs"><li id="tabDemo"><div class="tabTitle"></div><div class="closeTab"><img src="images/CloseImg.gif" alt="CLOSE"></div></li>
</ul>
</div>
<div id="tabContent">
</div>
</div>
</div>
-->

</body>
</html>


This is Java Scripts i Used
Java Scripts Folder (http://pixelmania.sitefrost.com/new/javascript/)

abduraooft
08-20-2010, 08:18 AM
But is giving me trouble with ie 6 and and Ie 7 please help me fix the css please. Please specify the issues.

PS: You shouldn't use tables for making layout (http://www.hotdesign.com/seybold/), which is a very bad practice.

raja19
08-20-2010, 04:53 PM
In IE 7 and 6 The tab title,tab browser, Browser are moving totally right hand side. they are not coming as in perfect direction.

Lookin to the screen shot Version IE -7

http://i38.tinypic.com/zloj8k.jpg

raja19
08-21-2010, 07:35 AM
Any help please ?? am still having this trouble.

raja19
08-21-2010, 06:00 PM
sorry for the bump.Am still got struck.Any help is really appreciated.

regards
raja

This is the screen hot in IE7 please help me .

http://i36.tinypic.com/rqxlp0.jpg



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum