syedasimmeesaq
asked on
CSS problem. The table goes way down than the block
I have a problem
In this section of my CSS
.post_top {
background:url('images/con tent_top.g if') no-repeat;
width:533px;
height:31px;
}
.post_btm {
background:url('images/con tent_btm.g if') no-repeat;
width:533px;
height:31px;
}
when I enter the post and the post is longer than it doesn't keep the style intact and my footer goes up while my posts go all the way down. How can I adjust it so that the style keeps intact and doesn't matter how long a post is.
Thanks
In this section of my CSS
.post_top {
background:url('images/con
width:533px;
height:31px;
}
.post_btm {
background:url('images/con
width:533px;
height:31px;
}
when I enter the post and the post is longer than it doesn't keep the style intact and my footer goes up while my posts go all the way down. How can I adjust it so that the style keeps intact and doesn't matter how long a post is.
Thanks
Hey,
I have no idea what you are talking about... can you post a link to the page or some html aswell
Cheers
Steggs
I have no idea what you are talking about... can you post a link to the page or some html aswell
Cheers
Steggs
ASKER
Steggs
I will have to make another non secure page for you to see. I will do it this evening.
Thanks
I will have to make another non secure page for you to see. I will do it this evening.
Thanks
cant u post the html for the page?
ASKER
do you need this. The idex page thats generated through the css
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="title" content="Develop Daly" />
<meta name="robots" content="index,follow" />
<link rel="stylesheet" type="text/css" href="style.css" media="screen,projection" />
<title>ABC</title>
</head>
<body>
<div id="page">
<div id="header">
<?php include('header.php'); ?>
</div>
<div id="content">
<div id="menu">
<div id="nav_top"></div>
<?php include('leftbar.php'); ?>
<div id="nav_btm"></div>
</div>
<div id="info">
<div class="post_top"></div>
<div class="post">
<?php include('posttop.php'); ?>
</div>
<div class="post_btm"></div>
<div class="post_top"></div>
<div class="post">
<?php include('postbtm.php'); ?>
</div>
<div class="post_btm"></div>
</div>
</div>
<div id="footer">
<?php include('footer.php'); ?>
</div>
</div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="title" content="Develop Daly" />
<meta name="robots" content="index,follow" />
<link rel="stylesheet" type="text/css" href="style.css" media="screen,projection" />
<title>ABC</title>
</head>
<body>
<div id="page">
<div id="header">
<?php include('header.php'); ?>
</div>
<div id="content">
<div id="menu">
<div id="nav_top"></div>
<?php include('leftbar.php'); ?>
<div id="nav_btm"></div>
</div>
<div id="info">
<div class="post_top"></div>
<div class="post">
<?php include('posttop.php'); ?>
</div>
<div class="post_btm"></div>
<div class="post_top"></div>
<div class="post">
<?php include('postbtm.php'); ?>
</div>
<div class="post_btm"></div>
</div>
</div>
<div id="footer">
<?php include('footer.php'); ?>
</div>
</div>
</body>
</html>
Hey mate,
ok you just need to clear your floats, add this p tag after your float
<div id="menu">
<div id="nav_top"></div>
<?php include('leftbar.php'); ?>
<div id="nav_btm"></div>
</div>
<div id="info">
<div class="post_top">post top</div>
<div class="post">
<?php include('posttop.php'); ?>
</div>
<div class="post_btm"></div>
<div class="post_top">post top</div>
<div class="post">
<?php include('postbtm.php'); ?>
</div>
<div class="post_btm"></div>
</div>
<p style="clear:both;margin:0 ;padding:0 ;line-heig ht:1px;hei ght:1px">< /p> <!----------------------
</div>
ok you just need to clear your floats, add this p tag after your float
<div id="menu">
<div id="nav_top"></div>
<?php include('leftbar.php'); ?>
<div id="nav_btm"></div>
</div>
<div id="info">
<div class="post_top">post top</div>
<div class="post">
<?php include('posttop.php'); ?>
</div>
<div class="post_btm"></div>
<div class="post_top">post top</div>
<div class="post">
<?php include('postbtm.php'); ?>
</div>
<div class="post_btm"></div>
</div>
<p style="clear:both;margin:0
</div>
ASKER
I tried that. That didn't help.
could it be because I have table inside.
Thanks
could it be because I have table inside.
Thanks
No that should work... try adding overflow:auto to div#content.
ASKER
That adds a scroll bar..which fits ok but I didn't want the scroll bar.
Thanks
Thanks
ASKER
Here is the page I am having problems with
<?php
// Start the login session
session_start();
if (!$_SESSION['user'] || !$_SESSION['pass']) {
// What to do if the user hasn't logged in
// We'll just redirect them to the login page.
header('Location: ../../index.php');
die();
} else {
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="robots" content="index,follow" />
<link rel="stylesheet" type="text/css" href="../../style.css" media="screen,projection" />
<title>EXP</title>
</head>
<body>
<div id="page">
<div id="header">
<?php include('../../header.php' ); ?>
</div>
<div id="content">
<div id="menu">
<div id="nav_top"></div>
<?php include('../../leftbar.php '); ?>
<div id="nav_btm"></div>
</div>
<div id="info">
<div class="post_top"></div>
<div class="post">
<center>
<table width="370" border="2" bordercolor="#588CC8">
<tr>
<td width="113"><div align="center">ID</div></t d>
<td width="132"><div align="center"></div></td>
<td width="101"><div align="center">View</div>< /td>
</tr>
<tr>
<td><div align="center">
<table cellspacing="0" cellpadding="0">
<tr>
<td height="18" width="64">34</td>
</tr>
</table>
</div></td>
<td><div align="center">
<?php require_once('../../column .php');
?>
</div></td>
<td><div align="center">
<?php
$check_table = mysql_query("SELECT * FROM y_84");
$full_result = mysql_num_rows($check_tabl e);
$checksurvey = mysql_query("Select * from y_84 where submitdate ='N' or submitdate is NULL or submitdate=''") or die(mysql_error());
$checksurveystatus = mysql_num_rows($checksurve y);
//echo $checksurveystatus;
if ($checksurveystatus || !$full_result) {
$tok = mysql_query("SELECT linkadd FROM e_84 where token ='".$_SESSION['pass']."' AND completed =\"N\" or completed=''") or die(mysql_error());
$tokenquery = mysql_result($tok,0);
if ($tokenquery) {
//echo "<a href=".$tokenquery."\"\">T ake Survey</a>";
echo "<a href=".$tokenquery."\"\" target=_blank>Sey</a>";
}else{
echo '<span style="color: red;">No</span>';
}
}else{
echo '<span style="color: red;">Completed !!</span>';
}
?>
</div></td>
</tr>
<?php
echo "<h3>Secure Logout</h3>
<form action='../../logout.php' method='post'>
<input type='submit' value='Logout'>
</form>"; ?></center>
</div>
<div class="post_btm"></div>
</div>
</div>
</body>
</html>
<?php
}
?>
<?php
// Start the login session
session_start();
if (!$_SESSION['user'] || !$_SESSION['pass']) {
// What to do if the user hasn't logged in
// We'll just redirect them to the login page.
header('Location: ../../index.php');
die();
} else {
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="robots" content="index,follow" />
<link rel="stylesheet" type="text/css" href="../../style.css" media="screen,projection" />
<title>EXP</title>
</head>
<body>
<div id="page">
<div id="header">
<?php include('../../header.php'
</div>
<div id="content">
<div id="menu">
<div id="nav_top"></div>
<?php include('../../leftbar.php
<div id="nav_btm"></div>
</div>
<div id="info">
<div class="post_top"></div>
<div class="post">
<center>
<table width="370" border="2" bordercolor="#588CC8">
<tr>
<td width="113"><div align="center">ID</div></t
<td width="132"><div align="center"></div></td>
<td width="101"><div align="center">View</div><
</tr>
<tr>
<td><div align="center">
<table cellspacing="0" cellpadding="0">
<tr>
<td height="18" width="64">34</td>
</tr>
</table>
</div></td>
<td><div align="center">
<?php require_once('../../column
?>
</div></td>
<td><div align="center">
<?php
$check_table = mysql_query("SELECT * FROM y_84");
$full_result = mysql_num_rows($check_tabl
$checksurvey = mysql_query("Select * from y_84 where submitdate ='N' or submitdate is NULL or submitdate=''") or die(mysql_error());
$checksurveystatus = mysql_num_rows($checksurve
//echo $checksurveystatus;
if ($checksurveystatus || !$full_result) {
$tok = mysql_query("SELECT linkadd FROM e_84 where token ='".$_SESSION['pass']."' AND completed =\"N\" or completed=''") or die(mysql_error());
$tokenquery = mysql_result($tok,0);
if ($tokenquery) {
//echo "<a href=".$tokenquery."\"\">T
echo "<a href=".$tokenquery."\"\" target=_blank>Sey</a>";
}else{
echo '<span style="color: red;">No</span>';
}
}else{
echo '<span style="color: red;">Completed !!</span>';
}
?>
</div></td>
</tr>
<?php
echo "<h3>Secure Logout</h3>
<form action='../../logout.php' method='post'>
<input type='submit' value='Logout'>
</form>"; ?></center>
</div>
<div class="post_btm"></div>
</div>
</div>
</body>
</html>
<?php
}
?>
ASKER
any idea why is it doing it.
Thanks
Thanks
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thanks
XXXXXXXXXXXXXXXXXXXXXXXXXX
* {
padding:0;
margin:0;
}
html, body {
height: 100%;
}
body {
text-align: left;
margin:0 auto;
padding:0;
color:#000;
font-style:normal;
font-variant:normal;
font-weight:normal;
font-size:10px;
font-family:Verdana, Tahoma, Arial, sans-serif;
background:#fff;
background:#f0f6df;
}
#page {
width:810px;
margin:0 auto;
height:100%;
}
#header {
width:810px;
height:120px;
margin: 0 auto;
background: url('images/header.gif') no-repeat;
padding:0px;
}
#content {
padding:5px 20px 0 20px;
background:url('images/con
height:100%;
}
/*************************
#nav_top {
background:url('images/nav
width:225px;
height:28px;
}
#nav_btm {
background:url('images/nav
width:225px;
height:28px;
}
#menu {
float:left;
width: 225px;
color:#000;
background:url('images/nav
}
#menu ul {
list-style:none;
width:218px;
font-size:12px;
padding:0 0 0 3px;
}
#menu li {
list-style-type: none;
background:transparent url('images/bullet.gif') no-repeat 12px 6px;
margin-bottom:4px;
border-bottom:1px solid #c8e5c7;
padding:0;
}
#menu li:hover {
background:#c8e5c7;
margin-bottom:4px;
}
#menu a {
display:block;
padding:0 0 0 20px;
color:#fff;
text-decoration: none;
background:f0f6df;
}
#menu a:hover {
display:block;
padding:0 0 0 20px;
color:#333;
text-decoration: none;
background:fff;
}
/*************************
#info {
float:right;
background:url('images/con
width:533px;
}
.post_top {
background:url('images/con
width:533px;
height:31px;
}
.post_btm {
background:url('images/con
width:533px;
height:31px;
}
.post {
padding:0 0 15px 25px;
}
img {
border:1px solid #fff;
padding:5px;
margin:3px;
}
a{
color:#fff;
text-decoration:none;
}
a:hover{
color:#000;
text-decoration:none;
}
h1{
color:#fff;
font-weight:normal;
font-size:20px;
padding: 40px 0 10px 40px;
}
h2 a{
position:absolute;
top:32px;
color:#666;
font-size:16px;
margin:0 0 0 575px;
text-decoration:none;
}
h2 a:hover{
color:#999;
}
h3{
color:#fff;
font-size:12px;
font-weight:bold;
padding: 5px 0 5px 10px
}
h4{
color:#fff;
font-size:20px;
font-weight:normal;
}
h5{
color:#8d8d8d;
font-size:10px;
font-weight:normal;
padding:5px;
}
h3 img{
float:left;
}
/*************************
ul {
list-style:none;
padding:0 0 0 3px;
}
li {
list-style-type: none;
background:transparent url('images/bullet.gif') no-repeat 12px 6px;
padding: 0 0 0 20px;
}
#menu a {
display:block;
padding:0 0 0 20px;
color:#fff;
text-decoration: none;
background:f0f6df;
}
#menu a:hover {
display:block;
padding:0 0 0 20px;
color:#333;
text-decoration: none;
background:fff;
}
/*************************
#footer{
text-align:center;
padding:40px;
background:url('images/bot
height:42px;
}
#footer a {
color:#000;
}
#footer a:hover {
color:#fff;
}
XXXXXXXXXXXXXXXXXXXXXXXXXX