Jump to content

div doesn't resize?

mark110384

By mark110384
in CSS Help

 Share

Recommended Posts

mark110384 Regular Member

mark110384

Posted
Posted

I have an issue with my resize down, when u adjust the browsers size the DIV doesn't resize accordingly as the rest of the page does, obviously this causes a problem when the DIV covers up the navigation menu. Any suggestions would be greatly appreciated. Thanks in advance.

 

HTML, JS AND PHP

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>Lilley and Gillie</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<link rel="stylesheet" href="../landgstylesheet.css">

<Script Language="JavaScript">

<!-- Script courtesy of http://www.web-source.net - Your Guide to Professional Web Site Design and Development

function load() {

var load = window.open('legal_information.html','','scrollbars=yes,menubar=no,height=600,width=800,resizable=yes,toolbar=no,location=no,status=no');

}

// -->

</Script>

 

<script language="javascript">

function openlogin() {

document.all.loginbox.style.visibility = "visible";

}

 

function close_it()

{

document.all.loginbox.style.visibility = "hidden";

}

function showmanuals() {

document.all.manuals.style.visibility = "visible";

document.all.brochures.style.visibility = "hidden";

document.all.drawings.style.visibility = "hidden";

 

}

function showbrochures(){

document.all.brochures.style.visibility = "visible";

document.all.manuals.style.visibility = "hidden";

document.all.drawings.style.visibility = "hidden";

}

function showdrawings(){

document.all.drawings.style.visibility = "visible";

document.all.brochures.style.visibility = "hidden";

document.all.manuals.style.visibility = "hidden";

}

</script>

 

</head>

 

<body>

 

<?

 

include("../functions.php");

 

//Get a connection to the database

$connect = @ConnectToDownloadsDb($dbhost, $dbuser, $dbname);

 

?>

 

<!--Contains Flash banner and Navigation-->

<table width="64%" height="100" border="0" cellpadding="0" cellspacing="0" align="center">

  <tr>

    <td height="2"></td>

  </tr>

  <tr>

    <td><param name="wmode" value="transparent">

        <embed src="../banner04.swf" height="170" width="100%" wmode="transparent" /></td>

  </tr>

  <tr>

    <td height="4"></td>

  </tr>

</table>

<table width="64%" border="0" cellpadding="0" cellspacing="0" align="center">

  <tr>

    <td><param name="wmode" value="transparent"> <embed src="../menu03.swf" height="105" width="100%" wmode="transparent" /></td>

  </tr>

</table>

<!--Main Content of page-->

<!-- Main table comtents content table-->

 

 

 

 

 

<table width="65%" border="0" cellpadding="0" cellspacing="0" align="center">

  <tr>

    <td width="93%" height="49"><param name="wmode" value="transparent"> <table width="100%" border="0" cellspacing="0" cellpadding="0">

        <tr>

          <td width="51%"><embed src="information_download_text.swf" height="50" width="100%" wmode="transparent" /></td>

          <td width="49%"> </td>

        </tr>

      </table></td>

  </tr>

  <tr>

    <td height="43"><param name="wmode" value="transparent"> <embed src="downloads_menu.swf" height="105" width="100%" wmode="transparent" /></td>

  </tr>

  <tr>

    <td height="322">

 

   

      <table width="100%" border="0" cellspacing="0" cellpadding="0">

        <tr>

          <td><!--White Space--></td>

        </tr>

      </table></td>

  </tr>

</table>

 

<!-- Links amnd legal information-->

<table width="64%" border="0" cellspaceing="0" cellpadding="0" align="center">

  <tr>

    <td height="39"> </td>

    <td><a href="http://www.adobe.com/products/acrobat/readstep2.html" target='_blank'><img src="get_adobe.bmp" border="0"/></a></td>

  </tr>

  <tr>

    <td width="89%"> </td>

    <td width="11%"> </td>

  </tr>

</table>

 

 

 

<table width="64%" border="0" align="center" bgcolor="#DADADA">

  <tr>

    <td height="29"><table width="82%" height="25" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#DADADA">

        <tr>

          <td width="3%"></td>

          <td width="12%"></td>

          <td width="4%" height="2"></td>

          <td width="20%"></td>

          <td width="5%"></td>

          <td width="14%"></td>

          <td width="5%"></td>

        </tr>

        <tr>

          <td > </td>

    <td ><font face="lucida sans" color="#666666" size="2"><a class="navi_text" href="../web3.htm"><b>HOME</b></font></a></td>

    <td height="23" ><img src="../dot.png"/></td>

    <td bgcolor="#DADADA"><font face="lucida sans" color="#666666" size="2"><a class="navi_text"><b>INFORMATION</b></font></a></td>

    <td height="23" ><img src="../dot.png"/></td>

    <td bgcolor="#DADADA"><font face="lucida sans" color="#666666" size="2"><a class="navi_text" href="../news/services-equipment.html"><b>SERVICES</b></font></a></td>

    <td height="23" ><img src="../dot.png"/></td>

    <td width="15%" bgcolor="#DADADA"><font face="lucida sans" color="#666666" size="2"><a class="navi_text"><b>PRODUCTS</b></font></a></td>

          <td width="4%" height="23" ><img src="../dot.png"/></td>

          <td width="18%" bgcolor="#DADADA"><font face="lucida sans" color="#666666" size="2"><a class="navi_text"><b>CONTACT US</b></font></a></td>

        </tr>

      </table></td>

  </tr>

  <tr>

    <td height="31"><table width="75%" border="0" align="center" bgcolor="#DADADA">

        <tr>

          <td width="74%" align="center"><font face="lucida sans" size="1" color="#666666">Copyright © Lilley and Gillie - <a class="navi_text" href="javascript:load()">Legal Information</a></font></td>

        </tr>

      </table></td>

  </tr>

</table>

 

<!-- DIV is hidden untill it is selected, faster access to the information-->

<div  id="manuals">

  <table class="bg_downloads">

    <tr>

      <td height="83"><table width="103%" height="180" border="0" cellpadding="0" cellspacing="0" background="download_bg.bmp">

          <tr>

            <td height="105"><table width="100%" border="0" cellspacing="0" cellpadding="0">

                <tr>

                  <td width="3%"> </td>

                  <td width="94%" height="22"> </td>

                </tr>

                <tr>

                  <td> </td>

                  <td height="81"><table width="100%" border="0" cellspacing="0" cellpadding="0">

                      <tr>

                        <td width="46%"><font face="lucida sans" size="2">Select

                          a <b>Manual</b> to view</font></td>

                        <td width="54%"> </td>

                      </tr>

                      <tr>

                        <td height="32"> </td>

                        <td>

                          <?

$sql = "SELECT * FROM manuals ORDER BY manual_id";

 

$result = mysql_query($sql) or die  ("Data not found");

 

while($myrow = mysql_fetch_array($result))

{

$manualid = $myrow['manual_id'];

 

$manualtitle = $myrow['manual_title'];

 

$manualurl = $myrow['manual_url'];

 

 

 

  ?>

                           <font face="Lucida sans" size="1" color="#000000">

                          <?

echo "<a class='download_text' href=$manualurl target='_blank'>$manualid - $manualtitle </a></br>"; ?>

                          </font>

                          <?

}  

?>

                        </td>

                      </tr>

                    </table></td>

                </tr>

              </table></td>

          </tr>

          <tr>

            <td height="70"> </td>

          </tr>

        </table></td>

    </tr>

    <tr>

      <td height="19"><img src="bottom_download_bg.bmp"/></td>

    </tr>

  </table>

</div>

 

 

 

<div  id="brochures">

  <table class="bg_downloads">

    <tr>

      <td height="83"><table width="103%" height="180" border="0" cellpadding="0" cellspacing="0" background="download_bg.bmp">

          <tr>

            <td height="105"><table width="100%" border="0" cellspacing="0" cellpadding="0">

                <tr>

                  <td width="3%"> </td>

                  <td width="94%" height="22"> </td>

                </tr>

                <tr>

                  <td> </td>

                  <td height="81"><table width="100%" border="0" cellspacing="0" cellpadding="0">

                      <tr>

                        <td width="46%"><font face="lucida sans" size="2">Select

                          a <b>Brochure</b> to view</font></td>

                        <td width="54%"> </td>

                      </tr>

                      <tr>

                        <td height="32"> </td>

                        <td>

                          <?

 

$sql = "SELECT * FROM brochures ORDER BY brochure_title";

 

$result = mysql_query($sql) or die  ("Data not found");

 

while($myrow = mysql_fetch_array($result))

{

 

$brochuretitle = $myrow['brochure_title'];

 

$brochureurl = $myrow['brochure_url'];

 

 

  ?>

                           <font face="Lucida sans" size="1" color="#000000">

                          <?

echo "<a class='download_text' href=$brochureurl target='_blank'>$brochuretitle </a></br>"; ?>

                          </font>

                          <?

}  

?>

                        </td>

                      </tr>

                    </table></td>

                </tr>

              </table></td>

          </tr>

          <tr>

            <td height="70"> </td>

          </tr>

        </table></td>

    </tr>

    <tr>

      <td height="19"><img src="bottom_download_bg.bmp"/></td>

    </tr>

  </table>

</div>

 

 

<div  id="drawings">

  <table class="bg_downloads">

    <tr>

      <td height="83"><table width="103%" height="180" border="0" cellpadding="0" cellspacing="0" background="download_bg.bmp">

          <tr>

            <td height="105"><table width="100%" border="0" cellspacing="0" cellpadding="0">

                <tr>

                  <td width="3%"> </td>

                  <td width="94%" height="22"> </td>

                </tr>

                <tr>

                  <td> </td>

                  <td height="81"><table width="100%" border="0" cellspacing="0" cellpadding="0">

                      <tr>

                        <td width="46%"><font face="lucida sans" size="2">Select

                          a <b>Drawing</b> to view</font></td>

                        <td width="54%"> </td>

                      </tr>

                      <tr>

                        <td height="32"> </td>

                        <td>

                          <?

 

$sql = "SELECT * FROM drawings ORDER BY drawing_id";

 

$result = mysql_query($sql) or die  ("Data not found");

 

while($myrow = mysql_fetch_array($result))

{

$drawingid = $myrow['drawing_id'];

 

$drawingtitle = $myrow['drawing_title'];

 

$drawingurl = $myrow['drawing_url'];

 

 

  ?>

                           <font face="Lucida sans" size="1" color="#000000">

                          <?

echo "<a class='download_text' href=$drawingurl target='_blank'>$drawingid - $drawingtitle </a></br>"; ?>

                          </font>

                          <?

}  

?>

                        </td>

                      </tr>

                    </table></td>

                </tr>

              </table></td>

          </tr>

          <tr>

            <td height="70"> </td>

          </tr>

        </table></td>

    </tr>

    <tr>

      <td height="19"><img src="bottom_download_bg.bmp"/></td>

    </tr>

  </table>

</div>

 

 

 

<!--Login Box at the bottom so it covers the other DIV's-->

<div id="loginbox">

  <table class="tint">

    <tr>

      <td width></td>

    </tr>

  </table>

  <form method="post" action="http://www.lilleyandgillie.co.uk/cms/login.php">

    <table class="logintable">

      <tr>

        <td height="169"> <table width="100%" border="0" cellspacing="3" cellpadding="3" bgcolor="#FFFFFF">

            <tr>

              <td></td>

              <td><table width="100%" border="0" cellspacing="0" cellpadding="0">

                  <tr>

                    <td width="90%"><font face="Lucida sans" size="2"><b>Chart

                      Management Services Login</b></font></td>

                    <td width="10%"><a href="javascript://" onMouseUp= "close_it()"><img src="http://localhost/example/webdesign/closebutton.JPG" border="0"</a></td>

                  </tr>

                </table></td>

            </tr>

            <tr>

              <td></td>

              <td height="74"><table width="98%" border="0" cellspacing="0" cellpadding="0">

                  <tr>

                    <td width="30%"><font face="lucida sans" size="2">User Name:</font></td>

                    <td width="70%"><input type="text" id="username" name="username" style="width:80%"></td>

                  </tr>

                  <tr>

                  <tr>

                    <td height="5"></td>

                  </tr>

                  <td><font face="lucida sans" size="2">Password:</font></td>

                  <td><input type="password" id="password" name="password" style="width:80%"></td>

                  </tr>

                </table></td>

            </tr>

            <tr>

              <td></td>

              <td><font face="lucida sans" size="2">Please leave blank to login

                as a guest</font></td>

            </tr>

            <tr>

              <td></td>

              <td height="57"><table width="100%" border="0" cellspacing="0" cellpadding="0">

                  <tr>

                    <td width="38%" height="53"> </td>

                    <td width="20%"><input class="submitbutton" type="submit" name="login" value="Login"></td>

                  </tr>

                </table></td>

            </tr>

          </table></td>

      </tr>

    </table>

  </form>

</div>

 

 

</body>

</html>

 

 

The CSS

/* CSS Document */

.tint

{

position: fixed;

filter:alpha(opacity=55);

opacity:.55;

 

width: 100%;

height: 100%;

min-height: 100%;

margin: 0px;

 

background-color:#63A5E1;

}

 

.logintable

{

position: absolute;

width: 30%;

height: 200;

top: 40%;

left: 35%;

background-color:#666666;

}

 

.submitbutton

{

width: 55%;

}

 

 

.download_text:link    {color:#666666; text-decoration:none;}

.download_text:visited {color:#CC0000; text-decoration:none;}

.download_text:active  {color:#666666; text-decoration:none;}

.download_text:hover  {color:#63A5E1; text-decoration:underline;}

 

 

.navi_text:link    {color:#666666; text-decoration:none;}

.navi_text:visited {color:#666666; text-decoration:none;}

.navi_text:active  {color:#666666; text-decoration:none;}

.navi_text:hover  {color:#63A5E1; text-decoration:underline;}

 

.other_news:link {color:#000000; text_decoration:none;}

.other_news:visited {color:#000066; text-decoration:none;}

.other_news:active  {color:#000000; text-decoration:none;}

.other_news:hover {color:#63A5E1; text-decoration:underline;}

 

.othernewstextbg { background-image: url(news/othernews_text_bg.bmp); }

 

.mainnewscontent { background-image: url(news/maincontentnews.bmp); }

 

.textbg { background-image: url(text_bg.bmp); }

 

.bg_downloads

{

position: absolute;

width: 68%;

height: 200;

top: 60%;

left: 17%;

 

}

 

body {

 

 

margin:0px;

overflow: auto;

 

}

 

 

#loginbox

{

position: absolute;

width: 100%;

height: 100%;

top: 0px;

left: 0px;

visibility: hidden;

 

}

 

#manuals

{

 

 

position: absolute;

width: 98%;

height: 2%;

top: 50%;

left: 0;

 

 

}

 

#brochures

{

position: absolute;

width: 98%;

height: 2%;

top: 50%;

left: 0;

visibility: hidden;

 

 

}

 

#drawings

{

position: absolute;

width: 98%;

height: 2%;

top: 50%;

left: 0;

visibility: hidden;

 

 

}

 

 

 

 

Link to comment
Share on other sites
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.