Page 1 of 1
Keep Content All Together
Posted: Tue Oct 14, 2014 11:10 pm
by Epiales
Okay, this is what the page should look like when you start the game and click on attack:
But when you join and start the game it is looking like this:
How do I make it where it stays at one place at all times, even when the page is scrolled? Right now the only way to fix it is to hit the CTRL key and scroll the mouse out to line the divs up to where it looks normal...Can't even see the attack information until you scroll it out
Any ideas? Driving me mad...
Re: Keep Content All Together
Posted: Wed Oct 15, 2014 12:17 am
by Sim
I don't understand. You got a link with a login?
Re: Keep Content All Together
Posted: Wed Oct 15, 2014 12:44 am
by Epiales
Sim wrote:I don't understand. You got a link with a login?
http://gameplaytoday.net
test@test.com
test
Re: Keep Content All Together
Posted: Wed Oct 15, 2014 1:23 am
by Sim
I still don't understand what your asking.
I see a problem with all URL's that go like this:
http://gameplaytoday.net/user.php?u={name}
The menu's are missing..
Re: Keep Content All Together
Posted: Wed Oct 15, 2014 1:37 am
by Epiales
That's the thing, there is nothing missing on my end. It's because the screen has to be scrolled in or out to line it all up. CTRL + your mouse wheel scrolling it until it lines up.
Re: Keep Content All Together
Posted: Wed Oct 15, 2014 6:03 am
by MikuzA
I see your <div>-tags are a bit broken..
Start by Removing all the <center></center>, since you have already started with <div>'s use css to align the content.
<div id="left"> is above all the meta/title stuff, which makes it a bit unlogical but works thought..
<div id="right"> is by itself on the right.
<div id="pageMiddle"> covers the whole area but is with a 'set width of 50%'
What my suggestion would be is that,
but all the 3 areas of your page to one big div. Make them with that stick together.
Also good thing to know is to use min-width/height and max-width/height to control different resolutions/zoomings in order to keep your page 'nice and tidy'.
Example:
http://jsfiddle.net/hup0d3cz/
Re: Keep Content All Together
Posted: Wed Oct 15, 2014 10:08 pm
by Epiales
MikuzA wrote:I see your <div>-tags are a bit broken..
Start by Removing all the <center></center>, since you have already started with <div>'s use css to align the content.
<div id="left"> is above all the meta/title stuff, which makes it a bit unlogical but works thought..
<div id="right"> is by itself on the right.
<div id="pageMiddle"> covers the whole area but is with a 'set width of 50%'
What my suggestion would be is that,
but all the 3 areas of your page to one big div. Make them with that stick together.
Also good thing to know is to use min-width/height and max-width/height to control different resolutions/zoomings in order to keep your page 'nice and tidy'.
Example:
http://jsfiddle.net/hup0d3cz/
Okay, I am working on u're suggestions. But I CANNOT get the page to center at all. I can get the toppage.php file to center, but not the rest of the screen. Sorry so much code, but have to give it all for someone to figure out why it won't center.
Main Page That holds all the divs:
Code: Select all
<?php include_once("php_includes/check_login_status.php")?>
<?php include_once("includes/functions.php"); ?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Mafia Wars Kingdom</title>
<link rel="icon" href="favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="style/style.css">
<left>
<?php include_once("template_pageTop.php"); ?>
</left>
<div id="left">
<?php include_once("leftbar.php")?>
</div>
<center>
<div id="pageMiddle">
<br />
<br />
</center>
</div>
<div id="right">
<?php include_once("rightbar.php"); ?>
</div>
</body>
</html>
My Style Sheet Info
Code: Select all
body { margin: 0px; font-family: Tahoma, Geneva, sans-serif; font-size: 14px;
background-color:#404040 }
/* PAGE TOP */
#pageTop {
/*background:url(headerSliver.png) repeat-x;*/
background-color:red;
background:url('ban.jpg');
height: 120px;
width:69.5%;
}
#pageTop > #pageTopWrap {
width: 1000px;
margin: 0px auto;
height: 100px;
}
#pageTop > #pageTopWrap > #pageTopLogo {
float: left;
height: 90px;
width: 108px;
}
#pageTop > #pageTopWrap > #pageTopRest {
float: left;
height: 90px;
width: 892px;
}
#pageTop > #pageTopWrap > #pageTopRest > #menu1 {
height: 44px;
}
#pageTop > #pageTopWrap > #pageTopRest > #menu1 > div {
margin-top: 8px;
padding: 4px;
text-align:right;
}
#pageTop > #pageTopWrap > #pageTopRest > #menu1 > div > img {
top: 6px;
position:relative;
}
#pageTop > #pageTopWrap > #pageTopRest > #menu1 > div > a {
color: #CCC;
text-decoration: none;
}
#pageTop > #pageTopWrap > #pageTopRest > #menu1 > div > a:hover {
color: #C0E73D;
}
#pageTop > #pageTopWrap > #pageTopRest > #menu2 {
height: 44px;
}
#pageTop > #pageTopWrap > #pageTopRest > #menu2 > div {
margin-top: 2px;
padding: 4px;
}
#pageTop > #pageTopWrap > #pageTopRest > #menu2 > div > a {
display: block;
float: left;
color:#CCC;
text-decoration: none;
margin: 0px 16px;
}
#pageTop > #pageTopWrap > #pageTopRest > #menu2 > div > a:hover {
color: #C0E73D;
}
#pageTop > #pageTopWrap > #pageTopRest >#menu2 > div > a > img{
position:relative;
top:-3px;}
#left {
float:left;
margin-top:5px;
width:auto;
background-color:#ccc;
height:auto;
}
/* GAME PAGE MIDDLE */
#pageMiddle{
float:left;
width: 50%;
height:928px;
margin: 5px 10px 0px 10px;
background-color:#ccc;
border:2px;
border-color:#660000;
}
#right {
float:left;
margin-top:5px;
width:auto;
height:auto;
background-color:#ccc;
}
My leftbar php include file
Code: Select all
<?php
$username = $_SESSION["username"];
// Select the member from the users table
$sql = "SELECT * FROM users WHERE username='$username' AND activated='1' LIMIT 1";
$user_query = mysqli_query($db_conx, $sql);
// Now make sure that user exists in the table
$numrows = mysqli_num_rows($user_query);
if($numrows < 1){
header("location: filenotfound.php");
exit();
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Mafia Wars Kingdom</title>
<link rel="icon" href="favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="style/style.css">
<script src="js/main.js"></script>
<style type="text/css">
<!--
.style4 {font-family: Tahoma, GeneVerdana, Arial, Helvetica, sans-serifva, sans-serif; font-size: 16px; color: #FFFFFF;}
-->
</style>
</head>
<body>
<center>
<div>
<ul class="menu">
<li><a href="" class="active"><span>GENERAL</span></a></li>
<li><a href="index.php"><span>Home</span></a></li>
<li><a href=""><span>Forums</span></a></li>
<li><a href="mafiawarskingdom.php?members=1"><span>Members</span></a></li>
<li><a href=""><span>Contact GM</span></a></li>
</ul>
<ul class="menu">
<li><a href="" class="active"><span>MEMBERS</span></a></li>
<li><a href="mafiawarskingdom.php?rankings=1"><span>Rankings</span></a></li>
<li><a href=""><span>Travel</span></a></li>
<li><a href="mafiawarskingdom.php?bank=1"><span>Bank</span></a></li>
<li><a href=""><span>Safe</span></a></li>
<li><a href="mafiawarskingdom.php?donate=1"><span>Donate</span></a></li>
<li><a href="mafiawarskingdom.php?usershop=1"><span>Shops</span></a></li>
<li><a href="quests.php"><span>Quests</span></a></li>
</ul>
<ul class="menu">
<li><a href="" class="active"><span>MAFIA FAMILY</span></a></li>
<li><a href="forums.php"><span>Information</span></a></li>
<li><a href="contactgm.php"><span>Income</span></a></li>
<li><a href="contactgm.php"><span>Bank</span></a></li>
<li><a href="contactgm.php"><span>Donations</span></a></li>
<li><a href="contactgm.php"><span>Shop</span></a></li>
</ul>
<ul class="menu">
<li><a href="" class="active"><span>JUDICIAL</span></a></li>
<li><a href=""><span>Jail</span></a></li>
<li><a href=""><span>Prison</span></a></li>
</ul>
</div>
My Rightbar php file
Code: Select all
<?php
include_once("includes/functions.php");
$username = $_SESSION["username"];
// Select the member from the users table
$sql = "SELECT * FROM users WHERE username='$username' AND activated='1' LIMIT 1";
$user_query = mysqli_query($db_conx, $sql);
// Now make sure that user exists in the table
$numrows = mysqli_num_rows($user_query);
if($numrows < 1){
header("location: filenotfound.php");
exit();
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Mafia Wars Kingdom</title>
<link rel="icon" href="favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="style/style.css">
<script src="js/main.js"></script>
<style type="text/css">
<!--
.style4 {font-family: Tahoma, GeneVerdana, Arial, Helvetica, sans-serifva, sans-serif; font-size: 16px; color: #FFFFFF;}
-->
</style>
</head>
<body>
<center>
<div>
<ul class="menu1">
<li><a href="" class="active"><span>RANKING</span></a></li>
<li><a href=""><span><left><img src="images/rankings1.png" width="15" height="30"> <?php echo $user_ranking; ?></span></a></li>
</ul>
<ul class="menu">
<li><a href="" class="active"><span>NOTIFICATIONS</span></a></li>
<li><a href="mafiawarskingdom.php?messages=1"><span>Messages</span></a></li>
<li><a href=""><span>Friend Reqs</span></a></li>
<li><a href="atklogs.php"><span>Attack Logs</span></a></li>
</ul>
<ul class="menu">
<li><a href="" class="active"><span>USER STATS</span></a></li>
</ul>
<div style="text-align:center">
<?php
$profile_pic = "";
$username = $_SESSION["username"];
// Select the member from the users table
$sql = "SELECT * FROM users WHERE username='$username' AND activated='1' LIMIT 1";
$user_query = mysqli_query($db_conx, $sql);
// Now make sure that user exists in the table
$numrows = mysqli_num_rows($user_query);
$row = mysqli_fetch_array($user_query, MYSQLI_ASSOC);
if($row['avatar'] == NULL){
$profile_pic = '<img src="images/avatardefault.png" width="166" height="130">';
echo $profile_pic;
}
else {
$profile_pic = '<center><img src="user/'.$_SESSION["username"].'/'.$row['avatar'].'" width="166" height="130">';
echo $profile_pic;
}
//************************* BEGINNING OF HEALTH STAT BAR *************************//
?>
<ul class="menu2">
<li><a href=""><span><img src="images/weap-pots/64/potionGreen.png" width='43' height='40' align="absmiddle">Health</span> <?php $width = ($row['hpoints'] / $row['maxhp']) * 100; $rounded = round($width); echo $rounded; ?>%</a></li><br>
<li><a href=""><span><img src="images/weap-pots/64/potionRed.png" width='43' height='40' align="absmiddle">Experience</span></a></li>
</ul>
<div id= "hpointsback">
<span><?php
echo "<img src='images/barback.png'>";
?></span>
</div>
<div id= "hpoints">
<?php
$width = ($row['hpoints'] / $row['maxhp']) * 150;
echo "<div style='float:left'><img src='images/hpoints.png' width='$width' height='10'> <div style='float:right'></div></div>";
?>
</div>
<br>
<div style="text-align:center">
<?php
$width = ($row['hpoints'] / $row['maxhp']) * 100;
?>
</div>
<div id= "expback">
<span><?php
echo "<img src='images/expback.png'>";
?></span>
</div>
<div id= "experience">
<?php
$width = ($row['userexp'] / $row['maxexp']) * 150;
echo "<div style='float:left'><img src='images/experience.png' width='$width' height='10'> <div style='float:right'></div></div>";
?>
<?php
$expneeded = ($user_level * 100) * $user_level;
if ($row['userexp'] >= $expneeded)
{ echo "<br><a href='mafiawarskingdom.php?levelup=1'>Level Up!!</a>";
} else {
echo $expneeded - $row['userexp'];
}
?>
</div>
<br />
<ul class="menu2">
<li><a href=""><span><img src="images/strength.png">Strength</span> <?php echo $row['strength'] ?></a></li>
<li><a href=""><span><img src="images/defense.png">Defense</span> <?php echo $row['defense'] ?></a></li>
<li><a href=""><span><img src="images/money.png">Money</span> <?php echo my_number_format($row['money']) ?></a></li>
<li><a href=""><span><img src="images/bank.png">Bank</span> $<?php echo my_number_format($row['bank']) ?></a></li>
</ul>
<ul class="menu">
<li><a href="" class="active"><span>CRIME-SPREE</span></a></li>
<li><a href=""><span>Break-Ins</span></a></li>
<li><a href=""><span>Robberies</span></a></li>
<li><a href=""><span>Hit List</span></a></li>
</ul>
<ul class="menu2">
<li><a href="" class="active"><span>AMMUNITION</span></a></li>
<div id="posts">
<li><a href=""><span><img src="images/usershops/bulletsicon.png" width='43' height='20' align="absmiddle" >Bullets</span> <?php echo $row['bullets']; ?></a></li></div>
<li><a href=""><span><img src="images/usershops/AK-47bullets.png" width='48' height='20' align="absmiddle" >AK-47</span> <?php echo $row['AK-47'] ?></a></li>
</ul>
</div>
</div>
</body>
</html>
The top template header php
Code: Select all
<?php
$envelope = '<img src="images/new-message.png" width="25" height="25" alt="Notes" title="This envelope is for logged in members">';
$loginLink = '<a href="login.php">Log In</a> | <a href="signup.php">Sign Up</a>';
if($user_ok == true) {
$sql = "SELECT notescheck FROM users WHERE username='$log_username' LIMIT 1";
$query = mysqli_query($db_conx, $sql);
$row = mysqli_fetch_row($query);
$notescheck = $row[0];
$sql = "SELECT id FROM notifications WHERE username='$log_username' AND date_time > '$notescheck' LIMIT 1";
$query = mysqli_query($db_conx, $sql);
$numrows = mysqli_num_rows($query);
if ($numrows == 0) {
$envelope = '<a href="notifications.php" title="Your notifications and friend requests"><img src="images/message-already-read.png" width="25" height="25" alt="Notes" ></a>';
} else {
$envelope = '<a href="notifications.php" title="You have new notifications"><img src="images/notification.gif" width="25" height="25" alt="Notes"></a>';
}
$loginLink = '<a href="mafiawarskingdom.php?game=1">Game'.'</a> | <a href="user.php?u='.$log_username.'">'.$log_username.'</a> | <a href="logout.php">Log Out</a>';
}
?>
<style type="text/css">
<!--
.style1 {
color: #CCCCCC;
font-weight: bold;
font-size: 14px;
}
-->
</style>
<left>
<div id="pageTop">
<div id="pageTopWrap">
<div id="pageTopLogo">
<a href="index.php"></a> </div>
<div id="pageTopRest">
<div id="menu1">
<div>
<?php echo $envelope; ?> <?php echo $loginLink; ?>
</div>
</div>
<div id="menu2">
<div>
<a href="index.php">
<img src="images/home.png" alt="home" title="Home">
</a>
<!--<a href="#">Menu_Item_1</a>
<a href="#">Menu_Item_2</a> -->
</div>
</div>
</div>
</div>
</div>
I have no idea why I can't center the page, but maybe someone can see it... Thx
Re: Keep Content All Together
Posted: Thu Oct 16, 2014 12:38 pm
by Epiales
Anyone have any idea why I can't center page? I kind of stopped until I can fix this, as I have to redo the setup once I figure it out. No since in continuing until I get this resolved
Re: Keep Content All Together
Posted: Fri Oct 17, 2014 5:25 am
by MikuzA
Hello,
Since this is a HTML/CSS problem, can you put the site where the problem is online and throw the link here?
It's hard to see from the code, without actually 'seeing' it.
Or me guide me through at your game-site to the section where this issue sits.
[EDIT] Or I am looking at your game at
http://gameplaytoday.net/mafiawarskingdom.php?game=1 and trying to understand what part is not centered.
Re: Keep Content All Together
Posted: Fri Oct 17, 2014 1:34 pm
by Epiales
MikuzA wrote:Hello,
Since this is a HTML/CSS problem, can you put the site where the problem is online and throw the link here?
It's hard to see from the code, without actually 'seeing' it.
Or me guide me through at your game-site to the section where this issue sits.
[EDIT] Or I am looking at your game at
http://gameplaytoday.net/mafiawarskingdom.php?game=1 and trying to understand what part is not centered.
That is the game site server, but not the files I'm working with currently, that is why I put the code above. The game sites php is messed up so I'm working on new code on my localhost to upload to game server onine.