I’m not a CSS expert, but I believe you can only make an element a percentage of the height of its parent, thus if the parent has no explicit height you can set the height of the shadow box to one billion percent and nothing will happen 
I would just calculate the dimensions in JavaScript (you can use jQuery’s .height() & .width()) and pass them into the script as variables.
Yes that would be awesome…
At this point it works perfectly, but I know what you mean by making it generic, but might need your help with this if you dont mind me coming back to you through this post maybe Friday or over the weekend.
Will have a go at the back button and the width and height idea is great, thanks again.
Cheers
Yup, no problem.
I’m subscribed to the thread, so just post back here and I’ll see it.
Good luck
Hi,
All going well and have moved on now to make the whole system work, but for some reason and I just cant see it, the form on page 3 will just not submit.
I have been through the code and tried to break it and all, but I just cant figure it out.
To get there at the moment, use the top left yellow button, then the first options on each section after that to take you to the second page, i can fill in the form fine, click submit on that page and again all good.
But on the next page, I fill in the two textareas, find an image, go to submit, and it just wont go, and i cant work it out.
<!doctype html>
<?php
include "config.php";
//include "header2.php";
session_start();
$top_D = $_GET['top'];
$middle_D = $_GET['middle'];
$bottom_D = $_GET['bottom'];
date_default_timezone_set('Europe/London');
$_SESSION['name_A'] = $_POST["names"];
$_SESSION['projects_A'] = $_POST["projects"];
$_SESSION['companies_A'] = $_POST["companies"];
$_SESSION['numbers_A'] = $_POST["numbers"];
$_SESSION['top_A'] = $top_D;
$_SESSION['middle_A'] = $middle_D;
$_SESSION['bottom_A'] = $bottom_D;
//And on the next page...
//echo $_SESSION['name_A'];
//echo $_SESSION['projects_A'];
//echo $_SESSION['companies_A'];
//echo $_SESSION['numbers_A'];
//session_destroy(); // don't want the session anymore
?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="width=600" />
<meta content="text/html; charset=windows-1252" http-equiv="content-type">
<title>Page 3 - Liverpool Street Station</title>
<link rel="stylesheet" href="css/global.css" type="text/css" />
<link rel="stylesheet" type="text/css" href="css/adaptive_css.css" />
<link rel="stylesheet" type="text/css" href="shadowbox-3.0.3/shadowbox.css" />
<style>
.pageNo{ position:relative; border:#000000 solid 1px; height:20px; width:20px; background-color:#fffc00; padding:4px; }
fieldset {overflow:visible;}
legend {padding-left:10px; padding-right:10px;}
.form-field {overflow: visible; width: 90%; float:left; margin-left: 20px;}
.form-field label { display: block; }
.form-field input, .form-field select .form-field textarea {display: block; width: 100%; font-size:22px;}
input[type=button] {
color:#08233e;
font:2.4em Futura, 'Century Gothic', AppleGothic, sans-serif;
font-size:110%;
/* ... other rules ... */
cursor:pointer;
margin:20px;
}
input[type=button]:hover {
background-color:rgba(255,204,0,0.8);
}
textarea{
width: 96%;
height: 100px;
}
</style>
</head>
<body>
<div id="wrapper3" >
<div id="Drop_down_wrapper">
<ul>
<li id="firstDropMenu"><a href="main.php" title="Home">HOME</a></li>
<li>PAGE 1 | 2 | <span class="pageNo">3</span> | 4</li>
</ul>
<div id="secondDropMenu">
<ul>
<li><div id="time">30/12/2013 19:01</div></li>
</ul>
</div>
</div>
<div id="main_Page2">
<div id="breadCrumb">
<p><?=$top_D?> <? if ($middle_D== "") {?> <? } else { ?> - <?=$middle_D?> <? } ?> <? if ($bottom_D== "") { ?> <? } else { ?> - <?=$bottom_D?> <? } ?></p>
</div>
<div id="page2_Form">
<form name="form1" method="post" action="page4.php" style="position:relative; margin-top:5px;" autocomplete="on" enctype="multipart/form-data">
<fieldset>
<legend> Details of Hazard / Near Miss </legend>
<div class="input-text form-field">
<textarea name="comments" class="style"></textarea>
</div>
</fieldset>
<fieldset>
<legend> Action Taken? </legend>
<div class="input-text form-field">
<textarea name="feedback" class="style"></textarea>
</div>
</fieldset>
<fieldset>
<legend> Upload An Image </legend>
<div class="input-text form-field">
<input type="file" name="pic1" accept="image/*" capture="camera" />
</div>
</fieldset>
<input type="button" name="Submit" value="Submit" title="Submit" />
</form>
</div>
</div>
</div> <!-- end of wrapper div -->
<script src="http://code.jquery.com/jquery.js"></script>
</body>
</html>
Full code if needed.
Cheers
Hi there,
On page 3, change this:
<input type="button" name="Submit" value="Submit" title="Submit" />
to this:
<input type="submit" name="Submit" value="Submit" title="Submit" />
and all will be well
Tut,
Thanks Pullo, that has taken me three hours to sort out, should have just asked earlier, but wanted to see if I could sort it.
Such an easy problem to solve.
Anyway, happy new year Pullo.
Take care and thanks again
Just to outline what I did to come up with the error (maybe this’ll come in handy next time):
[LIST]
[]Went to the page with the form.
[]Saw that I couldn’t submit it by clicking on the submit button.
[]Inspected the source (Ctrl + U)
[]Copied the source to my PC so that I could reproduce the error locally - I could.
[]Removed all style sheets and scripts and checked if the error persisted - it did.
[]Removed all content other than the form and checked if the error persisted - it did.
[]Removed all form elements one by one checking if the error persisted - it did.
[]I was left with this:
<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head></head>
<body>
<form method="post" action="page4.php">
<input type="button" name="Submit" value="Submit" title="Submit" />
</form>
</body>
</html>
[/LIST]And then it was quite obvious where the error lay.