General Support2 afwas Jul 22, 2008 02:11
b2evolution CMS Support Forums- b2evolution Support
- Templates, skins, XHTML and CSS
- footbar is croped with long posting
1 sachin Jul 22, 2008 01:21
My b2evolution Version: Not Entered
hello all
i am having 3 column and footbar is of full length as the wrap.
with few posting everything is fine but long posting will make side bar expand vertically. this will cut the footbar on the sides.
how can i correct this
my index php is
<!--[if IE]><link rel="stylesheet" type="text/css" href="ie.css" /><![endif]-->
<div align="left">
<div id="wrap">
<div id="header">
<div id="topright">
<?php
// ------------------------- "page top" CONTAINER EMBEDDED HERE --------------------------
// Display container and contents:
skin_container( NT_('page top'), array(
// The following params will be used as defaults for widgets included in this container:
'block_start' => '<div class="description">',
'block_end' => '</div>',
'block_title_start' => '<h1>',
'block_title_end' => '</h1>',
) );
// ----------------------------- END OF "page top" CONTAINER -----------------------------
?>
</div>
</div><!-- end of header -->
<div id="navigation">
<ul>
<?php
// ------------------------- "Menu" CONTAINER EMBEDDED HERE --------------------------
// Display container and contents:
// Note: this container is designed to be a single <ul> list
skin_container( NT_('Menu'), array(
// The following params will be used as defaults for widgets included in this container:
'block_start' => '',
'block_end' => '',
'block_display_title' => false,
'list_start' => '',
'list_end' => '',
'item_start' => '<li>',
'item_end' => '</li>',
) );
// ----------------------------- END OF "Menu" CONTAINER -----------------------------
?>
</ul>
</div><!-- end of navigation -->
<div id="sidebar">
<?php
// ------------------------- SIDEBAR INCLUDED HERE --------------------------
skin_include( '_sidebar.inc.php' );
// Note: You can customize the default BODY footer by copying the
// _body_footer.inc.php file into the current skin folder.
// ----------------------------- END OF SIDEBAR -----------------------------
?>
</div>
<div id="sidebar_right">
<?php
// ------------------------- SIDEBAR INCLUDED HERE --------------------------
skin_include( '_sidebar_right.inc.php' );
// Note: You can customize the default BODY footer by copying the
// _body_footer.inc.php file into the current skin folder.
// ----------------------------- END OF SIDEBAR -----------------------------
?>
</div>
<div id="content">
<?php
// ------------------------- MESSAGES GENERATED FROM ACTIONS -------------------------
messages( array(
'block_start' => '<div class="action_messages">',
'block_end' => '</div>',
) );
// --------------------------------- END OF MESSAGES ---------------------------------
?>
<?php // ---------------------------------- START OF POSTS --------------------------------------
// Display message if no post:
display_if_empty();
while( $Item = & mainlist_get_item() )
{ // For each blog post, do everything below up to the closing curly brace "}"
?>
<div id="<?php $Item->anchor_id() ?>" lang="<?php $Item->lang() ?>">
<div class="post">
<?php
$Item->locale_temp_switch(); // Temporarily switch to post locale (useful for multilingual blogs)
?>
<h1>
<a href="<?php $Item->permanent_url() ?>" title="<?php echo T_('Permanent link to full entry') ?>"></a>
<?php $Item->title(); ?>
</h1>
<div class="entry">
<?php
// ---------------------- POST CONTENT INCLUDED HERE ----------------------
skin_include( '_item_content.inc.php' );
// Note: You can customize the default item feedback by copying the generic
// /skins/_item_feedback.inc.php file into the current skin folder.
// -------------------------- END OF POST CONTENT -------------------------
?>
</div>
<div class="postmetadata">
<?php
$Item->categories( array(
'block_start' => '<div>'.T_('Categories').': ',
'block_end' => '</div>',
'include_main' => true,
'include_other' => true,
'include_external'=> true,
'link_categories' => true,
) );
?>
<?php
// Link to comments, trackbacks, etc.:
$Item->feedback_link( array(
'type' => 'feedbacks',
'link_before' => '',
'link_after' => ' • ',
'link_text_zero' => '#',
'link_text_one' => '#',
'link_text_more' => '#',
'link_title' => '#',
'use_popup' => false,
) );
?>
<?php
$Item->edit_link( array( // Link to backoffice for editing
'before' => '',
'after' => ' • ',
) );
?>
<?php $Item->permanent_link(); ?>
</div>
<?php
// ------------------ FEEDBACK (COMMENTS/TRACKBACKS) INCLUDED HERE ------------------
skin_include( '_item_feedback.inc.php', array(
'before_section_title' => '<h4>',
'after_section_title' => '</h4>',
) );
// Note: You can customize the default item feedback by copying the generic
// /skins/_item_feedback.inc.php file into the current skin folder.
// ---------------------- END OF FEEDBACK (COMMENTS/TRACKBACKS) ---------------------
?></div>
<?php
locale_restore_previous(); // Restore previous locale (Blog locale)
?>
<?php } // --------------------------------- END OF POSTS ----------------------------------- ?>
<?php
// -------------- MAIN CONTENT TEMPLATE INCLUDED HERE (Based on $disp) --------------
skin_include( '$disp$', array(
'disp_posts' => '', // We already handled this case above
'disp_single' => '', // We already handled this case above
'disp_page' => '', // We already handled this case above
) );
// Note: you can customize any of the sub templates included here by
// copying the matching php file into your skin directory.
// ------------------------- END OF MAIN CONTENT TEMPLATE ---------------------------
?>
<div align="center">
<?php
// -------------------- PREV/NEXT PAGE LINKS (POST LIST MODE) --------------------
mainlist_page_links( array(
'block_start' => '<p class="center">',
'block_end' => '</p>',
'links_format' => '$prev$ :: $next$',
'prev_text' => '<< '.T_('Previous'),
'next_text' => T_('Next').' >>',
) );
// ------------------------- END OF PREV/NEXT PAGE LINKS -------------------------
?>
</div>
</div></div></div>
</div><!-- end of center -->
</div><!-- end of wrap -->
<?php
// ------------------------- BODY FOOTER INCLUDED HERE --------------------------
skin_include( '_body_footer.inc.php' );
// Note: You can customize the default BODY footer by copying the
// _body_footer.inc.php file into the current skin folder.
// ------------------------------- END OF FOOTER --------------------------------
?>
<?php
$Hit->log(); // log the hit on this page
debug_info(); // output debug info if requested
?>and .css
/*
* Evo Toolbar
* Note: ther emay be some properties that seem overkill but the fact is we need to override
* any too general styles a skin may want to bring in for its own body/general display.
*/
div#evo_toolbar {
background-color: ThreeDFace;
color: ButtonText;
border-top: 1px solid ThreeDHighlight;
border-bottom: 1px solid ThreeDShadow;
text-align: left;
margin: 0;
/* font: menu; /* -- poorly supported */
font-size: 11px;
font-family: "Microsoft sans serif", sans-serif, Arial, Helvetica;
position: fixed;
z-index: 99;
left: 0px;
top: 0px;
height: 21px;
width:100%; /* Safari Windows */
-webkit-text-size-adjust: none; /* iPhone */
}
div.skin_wrapper_loggedin {
margin-top: 22px;
padding-top: 1px;
}
div#evo_toolbar a {
border: 1px solid ThreeDFace;
color: ButtonText;
text-decoration: none;
padding: 2px 1ex;
}
div#evo_toolbar a:hover {
border-top-color: ThreeDHighlight;
border-left-color: ThreeDHighlight;
border-bottom-color: ThreeDShadow;
border-right-color: ThreeDShadow;
}
div#evo_toolbar .actions_left {
padding: 4px;
}
div#evo_toolbar .actions_right {
padding: 4px;
float: right;
}
div#evo_toolbar ul {
padding: 0;
margin: 0;
list-style: none;
}
div#evo_toolbar li {
display: inline;
}
div#evo_toolbar li ul {
position: absolute;
z-index: 100;
background-color: ThreeDFace;
border: 1px solid;
padding: 1px;
border-top-color: ThreeDHighlight;
border-left-color: ThreeDHighlight;
border-bottom-color: ThreeDShadow;
border-right-color: ThreeDShadow;
width: 25ex; /* prevent page wide dropdowns in IE6; nicer hover in IE7 */
}
div#evo_toolbar li.menu_open ul {
display: block;
}
div#evo_toolbar li.menu_close ul {
display: none;
}
div#evo_toolbar li.menu_open:hover ul,
div#evo_toolbar li.menu_close:hover ul {
display: block;
}
div#evo_toolbar li ul li {
display: block;
padding: 0 4ex 0 0;
white-space: nowrap;
}
div#evo_toolbar li ul li a {
display: block;
padding: 4px 2ex;
border: none;
width: 100%;
}
div#evo_toolbar li ul li a:hover {
background-color: Highlight;
color: HighlightText;
}
div#evo_toolbar.evo_toolbar_safari li ul li a:hover {
background-color: #36d;
}
div#evo_toolbar li.separator {
padding: 0;
}
div#evo_toolbar hr {
display: block;
}
div#evo_toolbar .time {
margin: 0 1ex;
color: GrayText;
}
/* ---------------------------------------------- */
* {
padding: 0px;
margin: 0px;
}
body {
background: url(images/background.gif) repeat-x #afa907;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 8pt;
color: #ffffff;
margin: 0px 0px 0px 0px;
}
#wrap {
width: 1024px;
text-align:left;
}
#header {
height: 100px;
width: 1024px;
margin-bottom: 2px;
}
#topright {
float: right;
margin-top: 0px;
}
#navigation {
clear: both;
background: url(images/background_nav.gif) repeat-y;
border-top: 1px solid #bab100;
border-bottom: 1px solid #bab100;
padding: 3px 0px 5px 0px;
text-align: left;
font-size: 10pt;
font-weight: bold;
width: 1024px;
}
#sidebar {
padding: 0px 10px 0px 5px;
margin: 10px 0px 0px 0px;
float: left;
overflow: hidden;
width: 180px;
}
#content {
overflow: hidden;
width: 630px;
float: center;
margin: 20px 0px 0px 0px;
color: #474404;
}
.leftmargin {float:left;}
.leftmargin img {margin:10px 10px 10px 0;}
img.leftmargin {float:left; margin-right:2ex; margin-top:.7ex; margin-bottom:.2ex;}
img.rightmargin {float:right; margin-left:2ex; margin-top:.7ex; margin-bottom:.2ex;}
#footer {
clear: both;
background: url(images/background_footer.gif) repeat-x #9a9506;
padding: 15px 0px;
width: 1024px;
text-align: center;
color: #ffffff;
}
.post{ padding: 0px 0px 0px 5px;
background:url(images/background_entry.gif) repeat-x #9b9505;
width: 630px;
overflow: hidden;
margin-bottom: 15px;
}
.entry {
padding: 0px 5px 0px 10px;
/* width: 570px; */
}
#sidebar_right {
margin: 10px 0px 0px 0px;
float: right;
overflow: hidden;
width: 180px;
}
#comments {
padding: 10px 15px;
margin-top: 10px;
}
/* text */
#title h1 {
font-size: 24pt;
font-weight: normal;
}
#title h1 a {
color: #ffffff;
text-decoration: none;
margin: 0px 0px 0px 20px;
}
.description {
font-size: 11pt;
color: #e1e1e1;
}
#navigation ul li {
display: inline;
list-style: none;
}
#navigation li a {
color: #ffffff;
padding: 0px 15px;
text-decoration: none;
}
#navigation li a:hover {
color: #bab100;
}
#footer a {
color: #ffffff;
text-decoration: none;
}
#content ul,
#content ol,
#content h1,
#sidebar ul,
#sidebar h2,
#content h2,
#content h3,
#content h4,
p {
padding-bottom: 10px;
}
#content ul li,
#content ol li {
margin-left: 25px;
}
#content h1 {
font-size: 14pt;
font-weight: normal;
color: #ffffff;
padding: 15px 15px 5px 0px;
}
#content h1 a,
#content h1 a:hover {
color: #ffffff;
text-decoration: none;
}
#content h2 {
font-size: 12pt;
color: #ffffff;
padding: 15px 0px 0px 15px;
}
#content h2 a,
#content h2 a:hover {
color: #ffffff;
text-decoration: none;
}
#content h3 {
font-size: 11pt;
color: #ffffff;
padding: 15px 0px 0px 15px;
}
#content h3 a,
#content h3 a:hover {
color: #ffffff;
text-decoration: none;
}
#content h4 {
font-size: 10px;
color: #ffffff;
padding: 15px 0px 0px 15px;
}
#content h4 a,
#content h4 a:hover {
color: #ffffff;
text-decoration: none;
}
blockquote {
color: #ffffff;
margin: 10px 15px;
font-size: 9pt;
font-style: italic;
}
#content li a,
.entry a,
.post a {
color: #474404;
}
#content li a:hover,
.entry a:hover,
.post a:hover {
color: #ffffff;
}
#sidebar h2 {
font-size: 12pt;
}
#sidebar ul li {
list-style: none;
padding: 0px 0px 0px 0px;
}
#sidebar a {
font-weight: 700;
font-size: 10pt;
color: #ffffff;
text-decoration: none;
}
#sidebar a:hover {
color: #474404;
}
img {
border: 0px;
}
/* default */
.navigation {
padding: 10px 0px;
color: #ffffff;
}
.navigation a {
color: #ffffff;
text-decoration: none;
}
.alignleft {
float: left;
}
.alignright {
float: right;
}
.postmetadata {
color: #bab100;
padding: 5px 15px;
border: 1px solid #bab100;
background-color: #474404;
}
.postmetadata a,
.postmetadata a:hover {
color: #bab100;
text-decoration: none;
}
#date {
padding-bottom: 5px;
color:#ffffff;
}
#date a {
color:#ffffff;
text-decoration: none;
font-weight: normal;
}
.comment {
padding: 10px 0px;
}
/* form */
fieldset {
border: 0px;
padding: 0px 15px 15px 15px;
}
#author, #email, #url, #comment, .s {
border: 1px solid #999999;
padding: 5px;
font-size: 8pt;
}
#author, #email, #url, #comment {
padding: 5px;
}
.s {
padding: 3px;
}
.submit, .searchsubmit, .preview {
background-color: #82bbc3;
color: #ffffff;
border: 1px solid #666666;
font-size: 8pt;
padding: 2px;
margin: 3px 0px;
}
#commentform a {
color:#0072bc;
text-decoration: none;
}
#commentform a:hover {
color:#333333;
text-decoration: underline;
}
.bComment {
padding: 0px 15px;
}
.bCommentText {
padding: 0px 15px;
}
.bCommentSmallPrint {
font-size: 7pt;
padding: 0px 15px;
}
.feedback_feed_msg {
padding: 0px 15px;
}
.widget_core_coll_longdesc p {
padding-bottom: 0px;
}
.powered_by {
padding: 10px 0px;
}
/* ---------------------------------------------------------- */
#evo_toolbar ul li,
#evo_toolbar ol li {
margin-left: 0;
}
my link to my site http://med.myseda.com/
thank you
3 sachin Jul 22, 2008 02:25
thank you
i took out the link and the width of the footbar. now it is just placed in the center, which i do not want. i want the foot bar to extent all way from right side to left side of the site.
4 afwas Jul 22, 2008 02:40
In the index.php try to add another </div> before the footer (that's where there are another bunch of </div>'s
I didn't count them but it looks looks the div "content" isn't closed properly. If that doesn't work add another one, if you still have no success, report back to this topic because something else is wrong.
Good luck
5 sachin Jul 22, 2008 02:52
Excellent. worked very well
i guess div is missing from main skin too (pinkblossom). i downloaded more than 5 time and i have redone. i guess you are the moderator of this group if possible check the skin on e2b ( my request).
thank you very much Afwas
6 afwas Jul 22, 2008 03:03
You have a few errors left, see http://validator.w3.org/check?uri=http%3A%2F%2Fmed.myseda.com%2F&charset=(detect+automatically)&doctype=Inline&group=0
If you fix those your skin will work flawless.
To name a few:
- in the free html widget you need to enclose values in double quotes:
WRONG: width=100%
CORRECT: width="100%"
- In the index.php there is:
<div id="sidebar">
<div id="sidebar">
Remove one of them
- Sort out the DIV's and closing tags. At the moment there are too many closing </div>s. Remove them.
Good luck
In the css file look for this chunk:
and delete the line that says width: 1024px;
From the file _body_footer.inc.php in the folder of the skin remove the advertisement crap
Good luck