Hi, i have problem with side panel in my theme. The mid panel moved under previous content of page, but the sidepanel stayed behind the slider (see photo).. can someone help me how to align this panel with news panel?
Sorry for my eng, I hope somobody will understand
Screen:
styles.css
.clr{
clear:both;
}
.prvni_krok_blok {
width: 300px;
float: left;
height: 0 auto;
padding: 5px;
}
.prvni_krok_blok2 {
width: 300px;
float: left;
height: 0 auto;
padding: 5px;
margin-left: 15px;
}
.prvni_krok_blok3 {
width: 300px;
float: left;
height: 0 auto;
padding: 5px;
margin-left: 15px;
}
.prvni_krok_blok2 p {
margin: 0;
font-size: 12px;
margin-left: 5px;
}
.prvni_krok_blok p {
margin: 0;
font-size: 12px;
margin-left: 5px;
}
h2.prvni_krok_h2{
margin: 2px 0 10px;
font-size: 20px;
display: block;
color: darkgray;
text-shadow: 1px 1px 0 black;
}
.menu_button {
padding: 10px 10px;
margin-left: 5px;
height: 22px;
display: block;
float: left;
font-size: 15px;
color: #696969;
cursor: pointer;
}
.menu_button:hover {
background-color: #0e0e0e;
color: white;
text-decoration: none;
}
.search {
padding: 10px 10px;
margin-left: 5px;
height: 22px;
display: block;
float: left;
font-size: 15px;
color: #696969;
cursor: pointer;
}
.search:hover {
background-color: #0e0e0e;
#background:url('images/icons/png/24/sh.png') no-repeat;
text-decoration: none;
}
#stred-slider {
background: url(images/) no-repeat;
width: 973px;
height: 290px;
float: left;
}
.slider {
float:left;
width:973px;
height:290px;
position:relative;
}
.sliderContent {
float:left;
width:973px;
height:290px;
clear:both;
position:relative;
overflow:hidden;
}
.sliderContent .item {
position:absolute;
width:973px;
height:290px;
background:#fff;
}
a img {
border:none;
}
#prvni-krok {
background: url(images/prvni-krok-bg.png) no-repeat;
width: 973px;
height: 0 auto;
float: left;
margin-bottom: 5px;
margin-left: 2.5px;
border: 0;
}
#logo {
float: left;
height: 147px;
width: 326px;
margin: 35px 0 0 10px;
position: relative;
}
#logo h1 {
background: url("images/logo.png") no-repeat scroll 0 0 transparent;
height: 147px;
width: 326px;
margin: 0;
text-indent: -9999px;
}
#logo h1 a {
height: 147px;
width: 326px;
left: 0;
top: 0;
position: absolute;
}
#logo h1 a span {
display: none;
}
.footer-text {
width: 360px;
font-family: Arial;
font-size: 11px;
color: #5e7e9c;
font-stretch: expanded;
padding-left: 15px;
padding-top: 15px;
float: left;
}
.follow {
float: right;
padding-right: 15px;
padding-top: 7px;
}
#footer {
background: url(images/footer.png) no-repeat;
float: left;
width: 973px;
height: 76px;
margin-bottom: 35px;
margin-top: 50px;
box-shadow: 0 5px 15px 0px black;
-moz-box-shadow: 0 5px 15px 0px black;
-webkit-box-shadow: 0 5px 15px 0px black;
}
#footer-stin {
background: url(images/footer-stin.png) no-repeat;
margin: 0 auto;
width: 1025px;
height: 27px;
}
h2.scapmin-subject {
padding: 6px 0 0 10px;
margin: 0;
font-weight: normal;
font-size: 15px
}
h2.news-subject {
padding: 6px 0 0 10px;
float: left;
margin: 0;
font-weight: normal;
font-size: 15px
}
.news-autor {
background: url(images/napsal.png);
width: 202px;
height: 19px;
float: right;
color: #535353;
font-family: arial;
font-size: 11px;
margin-top: 5px;
margin-right: 5px;
text-align: center;
padding-top: 3px;
}
#container {
width: 973px;
margin: auto;
box-shadow: 0 0 15px 0px black;
-moz-box-shadow: 0 0 15px 0px black;
-webkit-box-shadow: 0 0 15px 0px black;
}
#content {
width: 973px;
float: left;
background: rgba(0,0,0,0.1);
}
#header {
width: 973px;
height: 245px;
margin: 0 auto;
}
#stin-menu {
background: url(images/pozadi-bg.png);
width: 1025px;
height: 26px;
margin: 0 auto;
}
#wrapper-center {
margin: 200px auto;
}
.menu {
background: url(images/menu-bg.png);
width: 973px;
height: 43px;
float: left;
}
/* Comment element properties */
a {
color: #254810;
text-decoration: none;
}
a:hover {
color: #483210;
text-decoration: underline;
}
a.side {
color: #254810;
text-decoration: none;
}
a:hover.side {
color: #483210;
text-decoration: underline;
}
a.white, li.white a {
color: #fff;
text-decoration: none;
}
a:hover.white, li.white a:hover {
color: #fff;
text-decoration: underline;
}
body {
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size: 12px;
color: #555;
background-image:url(images/);
background-position: center;
width:100%;
margin: 0px;
padding: 0px;
}
hr {
height: 1px;
border: 1px solid #eee;
}
hr.side-hr {
height: 1px;
border: 1px solid #eee;
}
td {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
}
pre {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
}
.alt {
color: #04688d;
}
.spacer {
margin-bottom: 5px;
}
.admin-message {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
text-align: center;
padding: 3px 4px 5px 4px;
margin-bottom: 5px;
}
/* Form element properties */
form {
margin: 0px;
}
.button {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #fff;
background: url(images/btn_bg.png) repeat-x;
height: 23px;
border: 1px solid #131313;
cursor: pointer;
box-shadow: 0 0 1px #2a2a2a inset;
border-radius: 4px;
}
.bbcode {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #000;
background-color: #eee;
border: 1px solid #ccc;
margin-top: 2px;
}
.bbcode-popup {
font-size: 11px;
color: #555;
background-color: #fff;
padding: 4px;
}
.textbox {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #555;
background-color: #f8f8f8;
border: 1px solid #ccc;
}
.textbox:focus {
color: #000;
background-color: #E1E1E1;
}
div.emulated-fieldset {
position: relative;
margin: 20px 0px 10px 0px;
border: 1px solid #ccc;
width: 320px;
background: inherit;
}
div.emulated-fieldset span.emulated-legend {
display: inline;
position: absolute;
top: -12px;
margin: 0 5px;
padding: 4px;
background: inherit;
}
div.emulated-fieldset div.attachments-list {
padding: 10px 3px 3px 3px;
width: 320px;
}
.main-footer {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #555;
}
.bottom-footer {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #fff;
background-color: #555;
padding: 4px 4px 5px 4px;
}
.main-body {
background: url(images/news-bg.png) repeat-x bottom #212121;
width: 673px;
height: auto;
float: left;
padding: 3px 0 0 5px;
color: #c2c2c2;
font-stretch: expanded;
margin-left: 2px;
}
/* Side-Panel properties */
.ui-sortable { margin: 0; padding: 0; }
.side-left .side-border-right {display: none;}
.side-right .side-border-left {display: none;}
.side-border-left {
color: #fff;
width: 0 auto;
position: absolute;
float: right;
}
#right {
color: #fff;
width: 295px;
float: right;
position: relative; top: 401px;
}
.scapmain {
font-family: Arial;
font-size: 15px;
color: #c2c2c2;
background: url(images/capmin-panel.png);
width: 287px;
height: 34px;
}
.side-body {
font-size: 10px;
color: #555;
background: url(images/panel-bg.png) repeat-x bottom #222222;
width: 0 auto;
}
.panel_stred, .panel_news {
width: 0 auto;
height: auto;
float: left;
}
.panel_right {
margin: 5px;
width: 0 auto;
height: auto;
float: left;
}
/* Center-Panel properties */
.news-category {
border: 0;
margin: 3px 5px 0 0;
float: left;
}
.news-footer {
background: url(images/news-footer.png);
width: 678px;
height: 33px;
float: left;
margin-left: 2px;
}
.news-footer-odkaz {
padding-top: 5px;
margin-left: 10px;
}
.news-footer a {
font-family: Arial;
font-size: 12px;
color: #535353;
text-decoration: none;
}
.news-footer a:hover {
font-family: Arial;
font-size: 12px;
color: #254810;
}
.capmain {
font-family: Arial;
font-size: 15px;
color: #c2c2c2;
background: url(images/scapmin-news.png);
width: 678px;
height: 34px;
float: left;
margin-left: 2px;
}
#left {
margin: 0 auto;
color: #555;
background-color: transparent;
width: 678px;
float: left;
}
/* General table properties */
.comment-avatar {
padding-right: 6px;
float: left;
}
.center {
margin: 0 auto;
}
.tbl-border {
border: 1px solid #353535;
}
.tbl {
font-size: 12px;
color: ;
background-color: ;
padding: 4px;
}
.tbl1 {
font-size: 11px;
color: ;
background-color: ;
padding: 4px;
margin: 0 auto;
}
.tbl2 {
font-size: 11px;
color: ;
background-color: ;
padding: 4px;
margin: 0 auto;
}
.tbl-error {
color: #AC260F;
font-weight: bold;
background-color: #FCCAC2;
border:2px solid #EB5339;
}
/* Profile spesific classes */
.profile, .profile_category {
width: 500px;
}
.edit-profile {
width: 500px;
}
/*.user_password .textbox:focus, .user_admin_password .textbox:focus {
background-color: #ff6666;
}*/
.profile_user_reason {
color: #ff6666;
font-weight: bold;
}
/*.user_name td, .user_name .textbox {
font-size: 13px;
padding: 4px;
}*/
.forum-caption {
font-size: 11px;
font-weight: bold;
color: #888;
background-color: #f1f1f1;
padding: 2px 4px 4px 4px;
}
.quote {
font-size: 11px;
color: #555;
background-color: #f8f8f8;
padding: 4px;
margin: 0px 20px 0px 20px;
border: 1px solid #bbb;
}
.poll {
height: 12px;
border: 1px solid #bbb;
}
.comment-name {
font-weight: bold;
color: #04688d;
}
.small {
font-size: 10px;
font-weight: normal;
}
.small2 {
font-size: 10px;
font-weight: normal;
color: #555;
}
.side-small {
font-size: 10px;
font-weight: normal;
color: #555;
}
.side-label {
color: #555;
background-color: #f1f1f1;
margin: 2px 0 2px 0;
padding: 2px 2px 3px 2px;
}
/* Vertical Navigation */
#navigation h2 {
font-size: 10px;
font-weight: normal;
background-color: #f1f1f1;
margin: 0;
padding: 4px;
}
#navigation ul {
margin: 0;
padding: 0;
list-style-type: none;
}
* html #navigation ul li{
height: 1%;
}
#navigation a {
display: block;
color: #555;
padding: 2px;
text-decoration: none;
}
#navigation a:hover {
color: #fff;
background-color: #f6a504;
}
#navigation li.first-link a {
font-weight:bold;
}
#navigation li.current-link a {
color: #555;
background-color: #eee;
border: 1px solid #fff;
padding: 1px !important;
}
/* Page Navigation */
.pagenav {
float: left;
margin: 5px 0;
padding: 4px;
width: 100%;
}
.pagenav span {
color: #fff;
background-color: #254810;
border: 1px solid #ddd;
padding: 2px 4px 2px 4px;
margin: 2px;
}
.pagenav a {
color: #555;
background-color: #f1f1f1;
border: 1px solid #ddd;
padding: 2px 4px 2px 4px;
margin: 2px;
text-decoration: none;
}
.pagenav a:hover {
color: #fff;
background-color: #254810;
margin: 2px;
text-decoration: none;
}
/* PHPFusion Helpers */
.clear {
clear: both;
}
.float-left {
float: left;
}
.float-right {
float: right;
}
/* Helpers */
.center {margin: 0 auto;}
.content_center {text-align: center;}
.flleft {float: left !important;}
.flright {float: right !important;}
.clear {clear: both;}
/* IE Fixes */
.clearfix:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
/* Hide from IE Mac */
.clearfix {
display:block;
}
/* End hide from IE Mac */
.floatfix {
overflow:hidden;
}
* html .floatfix {
width:100%;
}
.center, *[align="center"] {
margin: 0 auto;
}
.msearch {
height: 40px;
background-repeat: no-repeat;
Theme.php
<?php
if (!defined("IN_FUSION")) { die("Access Denied"); }
define("THEME_BULLET", "<span class='bullet'>·</span>");
require_once INCLUDES."theme_functions_include.php";
function render_page($license = false) {
global $settings, $main_style, $locale, $mysql_queries_time;
//Header
echo "<div id='header'>";
echo "<div id='logo'><h1><a href='/'>Senset games<span></span></a></h1></div>";
echo "</div>";
//Content
echo "<div id='container'>";
echo "<div class='menu'>
<a class='menu_button' href='#'>Domů</a>
<a class='menu_button' href='#'>Ke stažení</a>
<a class='menu_button' href='#'>Kontakty</a>
<a class='menu_button' href='#'>Fórum</a>
<a class='menu_button' href='#'>Pravidla</a>
<a class='menu_button' href='#'>Podpořte nás</a>
<a class='menu_button' href='#'>Informace</a>
<a href='/files/search.php' target='_top'><img src='".THEME."images/icons/png/24/s.png' border='0' alt='Search' class='follow search'/></a>
</div>";
echo "<div id='content'>";
echo "<div id='left'>";
echo "<div id='stred-slider'>
<div class='slider'>
<div class='sliderContent'>
<div class='item'>
<img src='".THEME."images/slider1.jpg' alt='' />
</div>
<div class='item'>
<img src='".THEME."images/slider1.jpg' alt='' />
</div>
<div class='item'>
<img src='".THEME."images/slider1.jpg' alt='' />
</div>
<div class='item'>
<img src='".THEME."images/slider1.jpg' alt='' />
</div>
</div>
</div>
</div>";
echo "<div id='prvni-krok'>";
echo "<div class='prvni_krok_blok'>
<h2 class='prvni_krok_h2'><center>Připoj se k nám</center></h2>
<center><img src='".THEME."images/icons/png/48/plug.png' alt='' width='64' height='64'/></center>
</div>";
echo "<div class='prvni_krok_blok2'>
<h2 class='prvni_krok_h2'><center>Zapoj se do turnaje</center></h2>
<center><img src='".THEME."images/icons/png/48/champion-cup.png' alt='' width='64' height='64'/></center>
</div>";
echo "<div class='prvni_krok_blok3'>
<h2 class='prvni_krok_h2'><center>Sleduj náš stream</center></h2>
<center><img src='".THEME."images/icons/png/48/tv.png' alt='' width='64' height='64'/></center>
</div>";
echo "</div>";
echo "".U_CENTER.CONTENT.L_CENTER."</div>";
echo "<div id='right'>".RIGHT.LEFT."</div>";
echo "</div>";
echo "<div class='clr'></div>";
//Footer
echo "<div id='footer'>";
echo "<div class='footer-text'>".showcopyright()." Design by Senset & code by Senset</div>";
echo "
<a href='http://www.facebook.com/' target='_top'><img src='".THEME."images/follow/32x32/facebook.png' border='0' alt='Facebook' class='follow'/></a>
<a href='http://www.twitter.com/' target='_top'><img src='".THEME."images/follow/32x32/twitter.png' border='0' alt='Twitter' class='follow'/></a>
<a href='http://www.google.com/' target='_top'><img src='".THEME."images/follow/32x32/google.png' border='0' alt='Google' class='follow'/></a>
<a href='http://www.youtube.com/' target='_top'><img src='".THEME."images/follow/32x32/youtube.png' border='0' alt='YouTube' class='follow'/></a></div>";
//ukonceni Contentu
echo "</div>";
/*foreach ($mysql_queries_time as $query) {
echo $query[0]." QUERY: ".$query[1]."<br />";
}*/
}
/* New in v7.02 - render comments */
function render_comments($c_data, $c_info){
global $locale, $settings;
opentable($locale['c100']);
if (!empty($c_data)){
echo "<div class='comments floatfix'>\n";
$c_makepagenav = '';
if ($c_info['c_makepagenav'] !== FALSE) {
echo $c_makepagenav = "<div style='text-align:center;margin-bottom:5px;'>".$c_info['c_makepagenav']."</div>\n";
}
foreach($c_data as $data) {
$comm_count = "<a href='".FUSION_REQUEST."#c".$data['comment_id']."' id='c".$data['comment_id']."' name='c".$data['comment_id']."'>#".$data['i']."</a>";
echo "<div class='tbl2 clearfix floatfix'>\n";
if ($settings['comments_avatar'] == "1") { echo "<span class='comment-avatar'>".$data['user_avatar']."</span>\n"; }
echo "<span style='float:right' class='comment_actions'>".$comm_count."\n</span>\n";
echo "<span class='comment-name'>".$data['comment_name']."</span>\n<br />\n";
echo "<span class='small'>".$data['comment_datestamp']."</span>\n";
if ($data['edit_dell'] !== false) { echo "<br />\n<span class='comment_actions'>".$data['edit_dell']."\n</span>\n"; }
echo "</div>\n<div class='tbl1 comment_message'>".$data['comment_message']."</div>\n";
}
echo $c_makepagenav;
if ($c_info['admin_link'] !== FALSE) {
echo "<div style='float:right' class='comment_admin'>".$c_info['admin_link']."</div>\n";
}
echo "</div>\n";
} else {
echo $locale['c101']."\n";
}
closetable();
}
function render_news($subject, $news, $info) {
echo "<div class='panel_news'><div class='capmain'><h2 class='news-subject'>".$subject."</h2>";
echo "<div class='news-autor'>Napsal: ";
echo newsposter($info," ·");
echo "</div></div>\n";
echo "<div class='main-body'>".$info['cat_image'].$news."</div>\n";
echo "<div class='news-footer'><div class='news-footer-odkaz'><a href='news.php?readmore=".$info['news_id']."'>Přidat komentář</a></div></div></div>\n";
}
function render_article($subject, $article, $info) {
echo "<div class='panel_news'><div class='capmain'><h2 class='news-subject'>".$subject."</h2>";
echo "<div class='news-autor'>Napsal: ";
echo newsposter($info," ·");
echo "</div></div>\n";
echo "<div class='main-body'><div class='main-body-text'>".$info['cat_image'].$news."</div></div>\n";
echo "<div class='news-footer'><div class='news-footer-odkaz'><a href='news.php?readmore=".$info['news_id']."'>Přidat komentář</a></div></div>\n";
}
function opentable($title) {
echo "<div class='panel_stred'><div class='capmain'><h2 class='scapmin-subject'>".$title."</h2></div>\n";
echo "\n";
echo "<div class='main-body'>\n";
}
function closetable() {
echo "</div></div>\n";
}
function openside($title, $collapse = false, $state = "off") {
global $panel_collapse; $panel_collapse = $collapse;
echo "<div class='panel_right'><div class='scapmain'><h2 class='news-subject'>".$title."</h2></div>\n";
if ($collapse == true) {
$boxname = str_replace(" ", "", $title);
echo "<div class='scapmain' align='right'>".panelbutton($state, $boxname)."</div>\n";
}
echo "<div class='side-body'>\n";
if ($collapse == true) { echo panelstate($state, $boxname); }
}
function closeside() {
global $panel_collapse;
if ($panel_collapse == true) { echo "</div>\n"; }
echo "</div></div>";
}
?>
