SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Addict
    Join Date
    Oct 2010
    Posts
    323
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)

    main page overflow

    please the id = addpage is overflowing, below is the mark up and css
    Code PHP:
     
    <?php require_once("include/connection.php"); ?>
    <?php require_once("include/functions.php"); ?>
    <?php 
    if (intval($_GET['subj']) == 0) {
    			redirect_to("contents.php");
    }
     
    include_once("include/form_functions.php");
     
    // start form processing
    // only execute the form processing if the form has been submitted  
    if (isset($_POST['submit'])) {
    			$errors = array();
    			// form validation: initialise an array to hold our errors
    			$required_fields = array('menu_name', 'position', 'visible');
    			$errors = array_merge($errors, check_required_fields(required_fields));
     
         		$fields_with_lenghts = array('menu_name' => 30);
         		$errors = array_merge($errors, check_max_field_lenghts($fields_with_lenghts));
     
     
         //update
       			   $id = mysql_prep($_GET['subj']);
         			$menu_name = mysql_prep($_POST['menu_name']);
    				$position = mysql_prep($_POST['position']);
    				$visible = mysql_prep($_POST['visible']);
    				if (empty($errors)) {
    				$query = "UPDATE subjects SET
    							menu_name = '{$menu_name}',
    							position = {$position},
    							visible = {$visible}
    						WHERE  id = {$id}";
    					$result = mysql_query($query, $connection);
    					if (mysql_affected_rows() == 1) {
    					// Success
    					$message = "The subject was succesfully updated. ";
    					} else {
    					//failed
    					$message = "The subject was not succesfully updated. ";
    					$message .= "<br />". mysql_error();
    					}
         }else{
         			//error occured
         			$message = "There were " . count($errors) . " errors in the form.";
         }
     
    } // end of if (isset($_POST['submit']))
    ?>
    <?php find_selectedpage();  ?>
    <?php include("include/header.php"); ?>
    <div id="navigation">
    		<?php echo navigation($select_subject, $select_page); ?>
    </div> <!--end of navigation div -->
     
    <div id="bodycontent">
    		<h2>Edit Subject: <?php echo $select_subject['menu_name'];?></h2>
    		<?php if (!empty($message)) {
    		echo "<p class=\"message\">" . $message . "</p>";
    		} ?>
    		<?php
    		// output a list of the fields that had errors
    		if (!empty($errors)) {
    		echo "<p class=\"errors\">";
    		echo "Please review the following fields:<br />";
    		foreach($errors as $error) {
    		echo " - " . $error . "<br />";
    		}
    		echo "</p>";
    		}
    		?>
    		<form action="edit_subject.php?subj=<?php echo urlencode( $select_subject['id']); ?>
    		" method="post">
    <p>Subject name:
    		<input type="text" name="menu_name" value="<?php echo $select_subject['menu_name'];?>" id="menu_name" />
    </p>
    <p>Position:
    		<select name="position">
    <?php
    		$subject_set = get_all_subjects();
    		$subject_count = mysql_num_rows($subject_set);
    //$count+1 bcos we are adding a subject
    for($count=1; $count <= $subject_count+1; $count++) {
       			echo "<option value=\"{$count}\"";
       if ($select_subject['position'] == $count) {
       			echo " selected";
       }
       			echo ">{$count}</options>";
       }
    ?>
       </select>
       </p>
       <p>Visible:
       <input type="radio" name="visible" value="0"<?php
       if ($select_subject['visible'] == 0) {echo " checked";}
       ?> /> No
       &nbsp;
       <input type="radio" name="visible" value="1"<?php
       if ($select_subject['visible'] == 1) {echo " checked";}
       ?> />yes
       </p>
       <input type="submit" name="submit" value="Edit Subject" />
       &nbsp;&nbsp;
       			<a href="delete_subject.php?subj=<?php echo
       urlencode($select_subject['id']); ?>" onclick="return confirm('Are you
       sure?');"> Delete Subject</a>
       </form>
       <br />
       <a href="contents.php">Cancel</a>
       [COLOR="purple"]<div id="addpage">
       <h3>Pages in this subject:</h3>
       <ul>
       <?php
       $subject_pages = get_pages_for_subject($select_subject['id']);
       while($page = mysql_fetch_array($subject_pages)) {
       echo "<li><a href=\"contents.php?page={$page['id']}\">
       {$page['menu_name']}</a></li>";
       }
       ?>
       			</ul>
       			<br />
       			+ <a href="new_page.php?subj=<?php echo $select_subject['id']; ?>
       			">Add a new page to this subject</a>
       			</div>
    [/COLOR]</div>
    <?php require("include/footer.php"); ?>


    and the css
    Code CSS:
    /*
    CSS for Reacheasy site
    */
    	body,html {
     	margin: 0;
    }
     
    #page {
     	width: 1060px;
     	margin: 0 auto;
     	position: relative
     	/* is the same as: 
     	margin-top: 0;
     	margin-bottom: 0;
     	margin-left: auto;
     	margin-right: auto;
     */
    }
     
    /* sticky footer */
    /*Opera Fix*/
    body:before {
        content:"";
        height:100%;
        float:left;
        width:0;
        margin-top:-32767px;
    }
    #outer:after {
        clear:both;
        display:block;
        height:1%;
        content:" ";
    }
    /* ... */
    /*
    CSS for Reacheasy site
    */
    html, body {
        height:100%;
        margin:0;
        padding:0;
        border:none;
    background: url("img/aurora.jpg");
    }
    #outer {
        width:1060px;
        margin:auto;
        min-height:100%;
        margin-top:-52px;
        border-left:1px solid black;
        border-right:1px solid black;
    background: #A1A1A1 url(backgrounds/nav-bg.jpg) repeat-y left top    
    }
    * html #outer {
        height:100%
    }
    h1 {
        font-size: xx-large;
        color: white;
        padding: 2em 0 .2em .4em;
        margin: 0;
        background: url(img/header.jpg) repeat-y right;
    }
    h2 {
        font-size: x-large;
        color: white;
        padding: 2em 0 .2em .4em;
        margin: 0;
    }
    p {
        font-size:large;
        color: white;
        padding: 1em 0 .1em .2em;
        margin: 0;
    }
     
    ul#nav {
        height: 2em;
        list-style: none;
        margin: 0;
        padding: .2em 0;
        margin:0;
        background: url(img/tabs.gif);
    }
    ul#nav li {
        background: #48f url(img/tabs.gif);
        float: left;
        margin: 0 1px 0 0;
        padding-left: 10px;
        border-right: 1px solid #A1A1A1;
    }
    ul#nav a {
        background: url(img/tabs.gif) 100% 0;
        color: #008;
        display: block;
        float: left;
        height: 2em;
        line-height: 2em;
        padding-right: 10px;
        text-decoration: none;
    }
    ul#nav li.current {
        background-color: #48f;
        background-position: 0 -60px;
    }
    ul#nav li.current a {
        background-position: 100% -60px;
        color: #fff;
        font-weight: bold;
    }
    #navigation {
        width: 180px;
        float:left;
    }
     
     
    #navigation li {
        margin: 0 1px 0 0;
        padding-left: 0px;
        text-decoration: none;
       list-style: none;
    }
    #navigation a {
        color: #008;
        padding-right: 10px;
        text-decoration: none;
    }
     
    #navigation a:visited{
     color: #008;
    }
     
    #navigation p {
        font-size:xx-small;
        color: white;
        padding: 1em 0 .1em .2em;
        margin: 0;
    }
     
    #navigation ul.pages {
     padding-left: 2em;
     list-style: square;
     }
     
     
    #bodycontent {
        float:right;
        width:880px;
        background:black;
        height:390px;
    }
     
    #header {
        width:100%;
        border-top:52px solid #fff;
        border-bottom:1px solid #A1A1A1;
    }
    #footer {
        width:1060px;
        clear:both;
        height:50px;
        border-top:1px solid #000;
        background-color:#fff;
        border-bottom:1px solid #000;
        color:  #000000;
        text-align:center;
        margin:0 auto;  
    }
     
    ul#footlink {
    padding: 0px;
    margin: 0px;
    list-style-type: none;
    float: left;
    width: 100%;
    color: #fff;
    }
     
    ul#footlink li { 
    display: inline;
    text-align:center; 
    }
     
    #bannercontainer{
           width: 800px;
           height: 400px;
           padding: 0;
           margin-left: auto;
           margin-right: auto;
           background: #eee;
           border: 1px solid #000;
        }
     
        #bannercontainer a{
           display: block;
           width: 800px;
           height: 400px;
           padding: 0;
           background:#eee url(img/pr.jpg) 0 0 no-repeat;
        }
     
        #bannercontainer a:link,#bannercontainer a:visited{
           background:#eee url(img/pr.jpg) 0 0 no-repeat;
        }
     
        #bannercontainer a:hover{
           background:#eee url(img/pr.jpg) 150px 0 no-repeat;
        }
    #promo-banners{
      width:860px;
    }
     
    .promo-banner{
       border: medium none;
       display:block;
       float: left;
       padding: 0 19px 5px 0;
       width: 230px;
    }
    .promo-seo{
    color:white;
    display:block;
    float:left;
    font:12px arial;
    height:75px;
    margin-bottom:5px;
    padding:7px 5px 0;
    text-align:left!important;
    width:218px;
    }
    .promo-seo-link{
    color:#bdbdbd;
    text-decoration:none;
    }
    .promo-seo-link:visited{
    color:#bdbdbd;
    }
     
    [COLOR="Purple"]#addpage {
    margin-top: 2em;
    border-top:1px solid white;[/COLOR]
    }

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,097
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    When posting a CSS question, make sure to remove all PHP from the HTML so we can see what the browser sees (that is, once the page have been displayed in a browser). We can only guess at what the page looks like to the browser.

    Try adding overflow: hidden:

    Code:
    #addpage {
    margin-top: 2em;
    border-top:1px solid white;
    overflow: hidden;
    }
    If that doesn't work, send us the HTML that you see in the browser (i.e. go to view source and copy that).
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  3. #3
    SitePoint Addict
    Join Date
    Oct 2010
    Posts
    323
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    this is the html on the page when it is viewed

    Code HTML4Strict:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
      <head>
        <title>Reacheasy - Foremost website for easy reach of things globally</title>
        <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
    <link href="easy.css" rel="stylesheet" type="text/css"/>  
    </head>
      <body>
    <div id="outer">
    <div id="page">
    <div id="header">
    <h1>Reacheasy</h1>
     
      <ul id="nav">
        <li class="current"><a href="index.html">Home</a></li>
         <li><a href="women.html">Women</a></li>
         <li><a href="men.html">Men</a></li>
         <li><a href="children.html">Children</a></li>
         <li><a href="homeandappliances.html">Home&amp;Appliances</a></li>
     
         <li><a href="visionandsound.html">Vision&amp;Sounds</a></li>
          <li><a href="motoring.html">Motoring</a></li>
          <li><a href="homemore.html">More</a></li>
          <li><a href="homecontact.html">Contact us</a></li>
          <li><a href=" rl.html">Register/Log in</a></li>
      </ul>
     
    </div> <!--end of navigation div -->
    </div>
    <div id="navigation">
    		<ul><li
            class="selected"><a href="edit_subject.php?subj=1">About reacheasy</a></li><ul class="pages"><li><a href="contents.php?page=1">History</a></li><li><a href="contents.php?page=2">Our mission</a></li></ul><li><a href="edit_subject.php?subj=2">Products</a></li><ul class="pages"><li><a href="contents.php?page=3">game</a></li></ul><li><a href="edit_subject.php?subj=3">Service</a></li><ul class="pages"></ul><li><a href="edit_subject.php?subj=4">tunde did it work again</a></li><ul class="pages"></ul></ul></div> <!--end of navigation div -->
     
    <div id="bodycontent">
    		<h2>Edit Subject: About reacheasy</h2>
     
    						<form action="edit_subject.php?subj=1		" method="post">
    <p>Subject name:
    		<input type="text" name="menu_name" value="About reacheasy" id="menu_name" />
    </p>
    <p>Position:
    		<select name="position">
    <option value="1" selected>1</options><option value="2">2</options><option value="3">3</options><option value="4">4</options><option value="5">5</options>   </select>
       </p>
       <p>Visible:
       <input type="radio" name="visible" value="0" /> No
       &nbsp;
     
       <input type="radio" name="visible" value="1" checked />yes
       </p>
       <input type="submit" name="submit" value="Edit Subject" />
       &nbsp;&nbsp;
       			<a href="delete_subject.php?subj=1" onclick="return confirm('Are you
       sure?');"> Delete Subject</a>
       </form>
       <br />
       <a href="contents.php">Cancel</a>
     
       <div id="addpage">
       <h3>Pages in this subject:</h3>
       <ul>
       <li><a href="contents.php?page=1">
       History</a></li><li><a href="contents.php?page=2">
       Our mission</a></li>   			</ul>
       			<br />
     
       			+ <a href="new_page.php?subj=1   			">Add a new page to this subject</a>
       			</div>
    </div>
    <div id="footer">
    <ul id="footlink">
         <li><a href="contact.html">Contact us</a></li>
         <li><a href="termsandcondition.html">Terms&amp;Condition</a></li>
         <li><a href="right.html">Copyright</a></li>
     
         <li><a href="faq.html">Faq</a>
    </li>
    </ul>
    </div>
    </body>
    </html>

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,097
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    Just remove the height from bodycontent:

    Code:
    #bodycontent {
        float:right;
        width:880px;
        background:black;
        height:390px; /* REMOVE THIS!  */
    }
    It's usually a bad idea to set a height on an HTML element.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  5. #5
    SitePoint Addict
    Join Date
    Oct 2010
    Posts
    323
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    thanks, it works, but they are some page where i dont have enough information on , it and it shows gap between the bodycontent and the footer like the one i paste below



    Code HTML4Strict:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
      <head>
        <title>Reacheasy - Foremost website for easy reach of things globally</title>
        <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
    <link href="easy.css" rel="stylesheet" type="text/css"/>  
    </head>
      <body>
    <div id="outer">
    <div id="page">
    <div id="header">
    <h1>Reacheasy</h1>
     
      <ul id="nav">
        <li class="current"><a href="index.html">Home</a></li>
         <li><a href="women.html">Women</a></li>
         <li><a href="men.html">Men</a></li>
         <li><a href="children.html">Children</a></li>
         <li><a href="homeandappliances.html">Home&amp;Appliances</a></li>
     
         <li><a href="visionandsound.html">Vision&amp;Sounds</a></li>
          <li><a href="motoring.html">Motoring</a></li>
          <li><a href="homemore.html">More</a></li>
          <li><a href="homecontact.html">Contact us</a></li>
          <li><a href=" rl.html">Register/Log in</a></li>
      </ul>
     
    </div> <!--end of navigation div -->
    </div>
    <div id="navigation">
    <ul><li><a href="edit_subject.php?subj=1">About reacheasy</a></li><ul class="pages"><li
            class="selected"><a href="contents.php?page=1">History</a></li><li><a href="contents.php?page=2">Our mission</a></li></ul><li><a href="edit_subject.php?subj=2">Products</a></li><ul class="pages"><li><a href="contents.php?page=3">game</a></li></ul><li><a href="edit_subject.php?subj=3">Service</a></li><ul class="pages"></ul><li><a href="edit_subject.php?subj=4">tunde did it work again</a></li><ul class="pages"></ul></ul>		<br />
    		<a href="new_subject.php">+ Add a new subject</a>
    	</ul>
     
    </div> <!--end of navigation div -->
     
    <div id="bodycontent">
     <h2> History</h2>
     <p>This is the company history for now</p>
     <p><a href="edit_page.php">Edit this page</a></p> <br />
     <br />
     
     
    </div>
    </div>
    <div id="footer">
    <ul id="footlink">
         <li><a href="contact.html">Contact us</a></li>
         <li><a href="termsandcondition.html">Terms&amp;Condition</a></li>
         <li><a href="right.html">Copyright</a></li>
         <li><a href="faq.html">Faq</a>
     
    </li>
    </ul>
    </div>
    </body>
    </html>

    Code CSS:
    /*
    CSS for Reacheasy site
    */
    	body,html {
     	margin: 0;
    }
     
    #page {
     	width: 1060px;
     	margin: 0 auto;
     	position: relative
     	/* is the same as: 
     	margin-top: 0;
     	margin-bottom: 0;
     	margin-left: auto;
     	margin-right: auto;
     */
    }
     
    /* sticky footer */
    /*Opera Fix*/
    body:before {
        content:"";
        height:100%;
        float:left;
        width:0;
        margin-top:-32767px;
    }
    #outer:after {
        clear:both;
        display:block;
        height:1%;
        content:" ";
    }
    /* ... */
    /*
    CSS for Reacheasy site
    */
    html, body {
        height:100%;
        margin:0;
        padding:0;
        border:none;
    background: url("img/aurora.jpg");
    }
    #outer {
        width:1060px;
        margin:auto;
        min-height:100%;
        margin-top:-52px;
        border-left:1px solid black;
        border-right:1px solid black;
    background: #A1A1A1 url(backgrounds/nav-bg.jpg) repeat-y left top    
    }
    * html #outer {
        height:100%
    }
    h1 {
        font-size: xx-large;
        color: white;
        padding: 2em 0 .2em .4em;
        margin: 0;
        background: url(img/header.jpg) repeat-y right;
    }
    h2 {
        font-size: x-large;
        color: white;
        padding: 2em 0 .2em .4em;
        margin: 0;
    }
    p {
        font-size:large;
        color: white;
        padding: 1em 0 .1em .2em;
        margin: 0;
    }
     
    ul#nav {
        height: 2em;
        list-style: none;
        margin: 0;
        padding: .2em 0;
        margin:0;
        background: url(img/tabs.gif);
    }
    ul#nav li {
        background: #48f url(img/tabs.gif);
        float: left;
        margin: 0 1px 0 0;
        padding-left: 10px;
        border-right: 1px solid #A1A1A1;
    }
    ul#nav a {
        background: url(img/tabs.gif) 100% 0;
        color: #008;
        display: block;
        float: left;
        height: 2em;
        line-height: 2em;
        padding-right: 10px;
        text-decoration: none;
    }
    ul#nav li.current {
        background-color: #48f;
        background-position: 0 -60px;
    }
    ul#nav li.current a {
        background-position: 100% -60px;
        color: #fff;
        font-weight: bold;
    }
    #navigation {
        width: 180px;
        float:left;
    }
     
     
    #navigation li {
        margin: 0 1px 0 0;
        padding-left: 0px;
        text-decoration: none;
       list-style: none;
    }
    #navigation a {
        color: #008;
        padding-right: 10px;
        text-decoration: none;
    }
     
    #navigation a:visited{
     color: #008;
    }
     
    #navigation p {
        font-size:xx-small;
        color: white;
        padding: 1em 0 .1em .2em;
        margin: 0;
    }
     
    #navigation ul.pages {
     padding-left: 2em;
     list-style: square;
     }
     
     
    #bodycontent {
        float:right;
        width:880px;
        background:black;
    }
     
    #header {
        width:100%;
        border-top:52px solid #fff;
        border-bottom:1px solid #A1A1A1;
    }
    #footer {
        width:1060px;
        clear:both;
        height:50px;
        border-top:1px solid #000;
        background-color:#fff;
        border-bottom:1px solid #000;
        color:  #000000;
        text-align:center;
        margin:0 auto;  
    }
     
    ul#footlink {
    padding: 0px;
    margin: 0px;
    list-style-type: none;
    float: left;
    width: 100%;
    color: #fff;
    }
     
    ul#footlink li { 
    display: inline;
    text-align:center; 
    }
     
    #bannercontainer{
           width: 800px;
           height: 400px;
           padding: 0;
           margin-left: auto;
           margin-right: auto;
           background: #eee;
           border: 1px solid #000;
        }
     
        #bannercontainer a{
           display: block;
           width: 800px;
           height: 400px;
           padding: 0;
           background:#eee url(img/pr.jpg) 0 0 no-repeat;
        }
     
        #bannercontainer a:link,#bannercontainer a:visited{
           background:#eee url(img/pr.jpg) 0 0 no-repeat;
        }
     
        #bannercontainer a:hover{
           background:#eee url(img/pr.jpg) 150px 0 no-repeat;
        }
    #promo-banners{
      width:860px;
    }
     
    .promo-banner{
       border: medium none;
       display:block;
       float: left;
       padding: 0 19px 5px 0;
       width: 230px;
    }
    .promo-seo{
    color:white;
    display:block;
    float:left;
    font:12px arial;
    height:75px;
    margin-bottom:5px;
    padding:7px 5px 0;
    text-align:left!important;
    width:218px;
    }
    .promo-seo-link{
    color:#bdbdbd;
    text-decoration:none;
    }
    .promo-seo-link:visited{
    color:#bdbdbd;
    }
     
    #addpage {
    margin-top: 2em;
    border-top:1px solid white;
    }


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •