b2evolution question Options

[YaWeaveIzOnFiyah]

Right now I'm trying to customize my layout so there's a header on top and the blog and sidebar and all that below it.

I've tried to enter my header on the 'header' section of my CSS but it moves the navigation bar to the top of the page & the header to the bottom

Ex. HERE

<!-- begin code provided by createblog.com --><br />body {<br />  font-family: arial;<br />  font-size: 11px;<br />  color: #6e0e2e;<br />  background: url(http://www.urban-esque.com/b2/skins/uneven/images/LilKimPattern.jpg); <br />}<br /><br />acronym {<br />  cursor: help;<br />  border-bottom: 1px solid #006DA6;<br />}<br /><br />/* -- Layout classes -- */<br /><br />#mainContainer {<br />  width: 760px;<br />  margin-left: auto;<br />  margin-right: auto;<br />}<br /><br />/* -- Content container -- */<br /><br />#content {<br />  float: right;<br />  width: 550px;<br />  margin-right: 10px;<br />}<br />#content a {<br />  text-decoration: none;<br />  border-bottom: 1px solid #DEFF00;<br />  color: #FFFFFF;  <br />}<br /><br />#content a:hover {  <br />  border-bottom: 1px solid #DEFF00;<br />  color: #DEFF00;<br />}<br /><br />#content a img {<br />  border: 0px;<br />}<br /><br />#sideBar li {<br />list-style: none;<br />}<br /><br />#sideBar ul {<br />  margin:0;<br />  padding:0;<br />}<br /><br />#content h1 {<br />  clear: both;  <br />  font-size: 1.0em;<br />  letter-spacing: 1px;<br />  text-transform: uppercase;<br />  text-indent: 10px;<br />  margin: 0px;<br />  border-top: 10px solid #000000; <br />  color: #DEFF00;<br />  background-color: #006DA6;<br />}<br />#content .postBox img {<br />margin:5px;<br />}<br />/* -- Content header and footer -- */<br /><br />#header {<br />  display: table-cell;  <br />  height: 404px;<br />  width: 550px;<br />  text-align: right;<br />  vertical-align: bottom;<br />  margin-bottom: 0px;<br />  background: url(http://www.urban-esque.com/b2/skins/uneven/images/LighersUp.jpg) no-repeat top left;  <br />}<br /><br />#footer {<br />  float: left;<br />  height: 75px;<br />  width: 550px;  <br />  font-size: 0.8em;<br />  text-transform: uppercase;<br />  text-align: center;  <br />  margin-top: 10px;<br />  margin-bottom: 10px; <br />  background: #333333 url(images/round_corner.gif) no-repeat bottom right;  <br />}<br /><br />#footer a {<br />  border: 0px;<br />  color: #DEFF00;  <br />}<br /><br />#footer a:hover {<br />  border: 0px;<br />  color: #AAAAAA;  <br />}<br />/* -- Boxes and tops -- */<br />.boxTop {<br />  clear: both;  <br />  font-size: 1.0em;<br />  letter-spacing: 1px;<br />  font-weight: bold;<br />  text-transform: uppercase;<br />  padding-left: 10px;<br />  margin: 0px;<br />  border-top: 10px solid #000000;<br />  color: #FFFFFF;<br />  background-color: #ff216c;<br />}<br />.postBox {<br />  margin-top: 0px;<br />  margin-bottom: 0px;<br />  padding: 8px;<br />  background: url(http://www.urban-esque.com/b2/skins/uneven/images/Ivory.jpg);<br />  border-top: 10px solid #333333;<br />}<br />.menuBox {<br />  margin-top: 0px;<br />  margin-bottom: 0px;<br />  background: url(http://www.urban-esque.com/b2/skins/uneven/images/Ivory.jpg);<br />  font-size: 11px;<br />  font-face: arial;<br />  color: #6e0e2e;<br />  text-transform: none;<br />  border-top: 10px solid #333333;<br />}<br /><br />/* -- Menu & news container -- */<br /><br />#sideBar {<br />  float: right;  <br />  width: 200px;<br />  margin: 0px;<br />  padding: 0px;  <br />  background-color: #333333;<br />}<br /><br />#sideBar p {    <br />  margin: 0px;<br />  padding: 5px 5px 10px 5px;<br />  background-color: #555555;<br />}<br /><br />#sideBar .postBox a {  <br />  text-decoration: none;<br />  border-bottom: 1px solid #DEFF00;<br />  color: #FFFFFF;<br />}<br /><br />#sideBar .boxTop a {  <br />  text-decoration: none;<br />  color: #DEFF00;<br />}<br />#sideBar .boxTop a:hover {<br />  color: #FFFFFF;<br />}<br /><br />#sideBar a:hover {<br />  color: #DEFF00;<br />}<br /><br />#sideBar a img {  <br />  vertical-align:middle;<br />  padding: 0 5px 0 5px;<br />  border: 0px;<br />}<br />#sideBar .menuBox a {<br />  border: 0px;<br />}<br /> <br />#sideBar a.menuItem, li.menuItem {<br />  display: block;<br />  clear: both;<br />  font-size: 11px;<br />  text-transform: uppercase;<br />  text-decoration: none;<br />  margin-top: 1px;<br />  padding: 0 0 0 25px;<br />  border: 0px;<br />  color: #FFFFFF;<br />  background: #6e0e2e url(images/relaxed_icn_menu.gif) no-repeat center left;<br />}<br />#sidebar a.boxTop {<br /> border: 0px;<br />  display: block;<br />}<br />#sideBar a:hover.menuItem, li:hover.menuItem {<br />  color: #FFFFFF;<br />  background: #d81c51 url(images/relaxed_icn_menu_on.gif) no-repeat center left;<br />}<br /><br />#sideBarHeader {<br />  height: 100px;<br />  background: #333333 url(images/relaxed_hdr_bg.gif) repeat-x bottom right;;<br />}<br /><br />#sideBarFooter {  <br />  height: 70px;<br />  border-top: 10px solid #000000;<br />  background: #333333 url(images/round_corner.gif) no-repeat bottom right;<br />}<br /><br />/* -- Title and sub-headings -- */<br /><br />.highLight {<br />  color: #DEFF00;<br />}<br /><br />/* -- IE CSS2 selector hack.  This still validates, but IE ignores the class defined<br />      with the [id].  The result is you set the IE specific value in the first class<br />      definition, and the standard compliant browser value in the second class -- */<br /><br />#title {<br />  font-size: 36px;<br />  padding: 48px 4px 0px 0px;  <br />}<br /><br />#title a, a:hover {<br />  border:0px;<br />}<br />#title[id] {<br />  padding-top: 0px;<br />  padding-bottom: 3px;<br />}<br /><br />#subtitle{<br />  display: block;  <br />  font-size: 10px;<br />  text-transform: uppercase;<br />  margin-top: -4px;<br />  border: 0px;<br />  color: #DEFF00;  <br />}<br /><br /><br />strong, .subHeading {<br />  font-size: 0.8em;<br />  text-transform: uppercase;  <br />  color: #DEFF00;  <br />}<br /><br />.subHeading {<br />  display: block;<br />}<br /><br />/* -- Images styles -- */<br /><br />.imgRight, .imgLeft {<br />  border: 1px solid #888888;<br />}<br /><br />.imgRight {<br />  float: right;<br />  margin: 0 0 10px 10px;<br />  <br />}<br /><br />.imgLeft {<br />  float: left;<br />  margin: 0 10px 10px 0;  <br />}<br /><br />/* -- Takes care of the 'jump to top' arrow -- */<br /><br />.upArrow {<br />  clear: both;<br />  display: block;<br />  text-align: right;<br />}<br /><br />.upArrow a img {  <br />  margin-top: 10px;<br />  border-bottom: 0px;<br />  background-color: #DEFF00;<br />}<br /><br />.upArrow a:hover img {  <br />  border: 0px;<br />  background-color: #BBBBBB;<br />}<br /><br />/* -- Quote block styles -- */<br /><br />.quote, blockquote {<br />  display: block;<br />  margin: 10px 20px 10px 20px;<br />  padding: 4px;  <br />  border: 1px solid #888888;<br />  background-color: #666666;<br />}<br /><br />.author {<br />  display: block;<br />  font-size: 0.8em;<br />  text-transform: uppercase;<br />  color: #DEFF00;<br />}<br />.bSmallPrint {<br />  font-size: 0.8em;<br />}<br /><br />fieldset {<br />  border: 0px;<br />}<br />/* Calendar: */<br />caption.bCalendarCaption {<br /> border: 0px solid #ccc;<br /> background-color: #eee;<br /> border-bottom: 0;<br /> font-size: 105%;<br /> font-weight: bold;<br /> margin: auto;<br /> padding: .5ex 0;<br /> white-space: nowrap;<br />}<br />table.bCalendarTable {<br /> border: solid 0px #ccc;<br /> border-collapse: separate;<br /> margin: 0 auto 1em auto;<br /> font-size: 77%;<br /> border-spacing: 0px; <br />}<br />table.bCalendarTable tfoot td {<br /> border-top: 1px solid #ccc;<br />}<br />table.bCalendarTable tfoot a {<br /> text-decoration: none;<br />}<br />table.bCalendarTable tfoot a:hover {<br /> background-color: #78a;<br /> color: #fff;<br />}<br />th.bCalendarHeaderCell {<br /> color: #abc;<br />  font-size:0.7em;<br />}<br />#bCalendarToday {<br /> background: url(http://www.urban-esque.com/b2/skins/uneven/images/Ivory.jpg);<br />}<br />tr.bCalendarRow {<br /> text-align: center;<br />}<br />th.bCalendarHeaderCell {<br /> font-size: 84%;<br /> width: 4ex;<br />}<br />td.bCalendarCell {<br /> width: 4ex;<br /> height: 3.5ex;<br />}<br />.bCalendarLinkPost {<br /> font-weight: bold;<br />}<br />td#prev,<br />td#next {<br /> font-weight: bold;<br /> font-size: 105%;<br /> padding: .5ex;<br /> white-space: nowrap;<br />}<br />td#prev a,<br />td#next a {<br /> padding: 0 .5ex;<br />}<br />td#prev {<br /> text-align: left;<br />}<br />td#next {<br /> text-align: right;<br />}<br /><br /><br /><!-- end code provided by createblog.com -->

^^ Those are my codes, could anybody tell me what's wrong with it?

[YaWeaveIzOnFiyah]

oh, iqht i`ll try it.

i'll edit back with my results.

edit
okay i fixed that part, but I now I have a big margin from my navbar to my blog



^^ Is there any way I can fix that?

<!-- begin code provided by createblog.com --><br /><br /><?php<br /> /** This is the main template. It displays the blog. */<br />if( !defined('DB_USER') ) die( 'Please, do not access this page directly.' );<br />?><br /><!DOCTYPE html PUBLIC "-W3CDTD XHTML 1.0 TransitionalEN" "http:www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br /><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php locale_lang() ?>" lang="<?php locale_lang() ?>"><br /><head> <br /><meta http-equiv="Content-Type" content="text/html; charset=<?php locale_charset() ?>" /><br /><title><?php<br /> $Blog->disp('name', 'htmlhead');<br /> single_cat_title( ' - ', 'htmlhead' );<br /> single_month_title( ' - ', 'htmlhead' );<br /> single_post_title( ' - ', 'htmlhead' );<br /> arcdir_title( ' - ', 'htmlhead' );<br /> last_comments_title( ' - ', 'htmlhead' );<br /> stats_title( ' - ', 'htmlhead' );<br />?><br /></title><br /><base href="<?php skinbase(); // Base URL for this skin. You need this to fix relative links! ?>" /><br /><meta name="description" content="<?php $Blog->disp( 'shortdesc', 'htmlattr' ); ?>" /><br /><meta name="keywords" content="<?php $Blog->disp( 'keywords', 'htmlattr' ); ?>" /><br /><meta name="generator" content="b2evolution <?php echo $b2_version ?>" /> <!-- Please leave this for stats --><br /><link rel="alternate" type="text/xml" title="RDF" href="<?php $Blog->disp( 'rdf_url', 'raw' ) ?>" /><br /><link rel="alternate" type="text/xml" title="RSS .92" href="<?php $Blog->disp( 'rss_url', 'raw' ) ?>" /><br /><link rel="alternate" type="text/xml" title="RSS 2.0" href="<?php $Blog->disp( 'rss2_url', 'raw' ) ?>" /><br /><link rel="alternate" type="application/atom+xml" title="Atom" href="<?php $Blog->disp( 'atom_url', 'raw' ) ?>" /><br /><link rel="pingback" href="<?php $Blog->disp( 'pingback_url', 'raw' ) ?>" /><br /><link rel="stylesheet" type="text/css" href="stylesheet.css" media="screen, tv, projection" /><br /></head><br /><br /><body><br /><div align="center"><?php include("http://www.urban-esque.com/b2/skins/uneven/images/header.php"); ?></div><br />  <!-- Menu start --><br />  <div id="sideBar"><br /><br />    <!-- Menu header start --><br />    <!-- Menu items --><br /><div class="boxTop">Tha Diva</div><br />            <div class="menuBox"><br />Hi . =]<br /><script language="JavaScript" src="http://hosted-scripts.com/aimstatus.php?sn=YaWeaveIzOnFiyah"></script><br /></div><br /><div class="boxTop">Site Stats</div><br /><div class="menuBox"><!-- Start FastWebCounter.com  --><br /><script language="JavaScript1.2"  type="text/javascript" src="http://regretless.com/dodo/newworld/dodocounter/link.php?id=2497"></script><br /><b>Webmistress</b> - Elizabeth<br><br /><b>Purchased On</b> - July 21, 2005<br><br /><b>Expires</b> - July 21, 2006<br><br /><b>Version</b> - .o1<br><br /><b>Theme</b> - Urbanized<br><br /></div><br /><div class="boxTop">Navigate</div><br /><div class="menuBox"><a href="http://urban-esque.com/thadiva/index.php" class="menuItem">Webmistress</a><br /><a href="http://urban-esque.com/visitor.php" class="menuItem">Goodies</a><br /><a href="http://urban-esque.com/Domain.php" class="menuItem" title="Domain">Domain</a><br /><a href="http://urban-esque.com/Credits" class="menuItem" title="Creditz">Creditz</a><br /><a href="http://www.urban-esque.com/askme/faq.php" class="menuItem" title="Ask Me">Questions? Ask Me</a><br /></div><br /><div class="boxTop">Currently</div><br /> <div class="menuBox"><br /><? include("http://www.urban-esque.com/currently/current.php"); ?><br /></div><br /><div class="boxTop">Things To Do</div><br />                <div class="menuBox"><br /><? include("http://www.urban-esque.com/thalist/list.php"); ?><br /></div><br /><br /><div class="boxTop"><a href="<?php $Blog->disp( 'lastcommentsurl', 'raw' ) ?>"><?php echo T_('Last comments') ?></a></div><br /><div class="postBox"> <br /><br />  <ul><br /><?php<br /><br />   $CommentList = & new CommentList( $blog, "'comment'", $show_statuses,'','','DESC','',5 );<br />   $CommentList->display_if_empty( '<div class="bComment"><p>'.T_('No comment yet...').'</p></div>' );<br /><br />   while( $Comment = $CommentList->get_next() )<br />   {   // Loop through comments:<br />      ?><br /><li>- <?php $Comment->author('','') ?> on <a href="<?php $Comment->permalink(); ?>" title="permalink to comment"><?php $Comment->Item->title(); ?></a><br /><br /></li><br /><?php<br />   }<br />?>        </ul><br /></div><br /><br /><?php // -------------------------- CALENDAR INCLUDED HERE -----------------------------<br /> require( dirname(__FILE__).'/_calendar.php' );<br /> // -------------------------------- END OF CALENDAR ---------------------------------- ?><br /><br /><br /><div class="boxTop"><?php echo T_('Archives'); ?></div><div class="postBox"><ul><br /><?php // -------------------------- ARCHIVES INCLUDED HERE -----------------------------<br /> require( dirname(__FILE__).'/_archives.php' );<br /> // -------------------------------- END OF ARCHIVES ---------------------------------- ?><br /></ul></div>   <br /><br /><!-- =============== SEARCH BOX ======================== --> <br /><div class="boxTop"><?php echo T_('Search') ?></div><br /><div class="postBox"><?php form_formstart( $Blog->dget( 'blogurl', 'raw' ), '', '', 'get', 'searchform' ) ?><br /> <br /> <div align="center"><input class="search" size="15" name="s" /><br /><br />        <input type="submit" value="Search" name="submit" class="btn"  /><br />        </div><br /></form><br /></div><br /><br /><?php if( ! $Blog->get('force_skin') )<br /> { // Skin switching is allowed for this blog: ?><br />   <div class="boxTop"><?php echo T_('Choose skin') ?></div><br />    <div class="postBox"> <ul><br />    <?php // ------------------------------- START OF SKIN LIST -------------------------------<br />    for( skin_list_start(); skin_list_next(); ) { ?><br />     <li><a href="<?php skin_change_url() ?>"><?php skin_list_iteminfo( 'name', 'htmlbody' ) ?></a></li><br />    <?php } // ------------------------------ END OF SKIN LIST ------------------------------ ?><br />   </ul></div><br />  <?php } ?><br />   <br /> <?php<br /><br />// ----------------- START OF STATS -----------------------------       <br />  if ($disp != 'stats') <br /> { ?><br /> <br /><div class="boxTop"><?php echo T_('Recent Referers') ?></div><div class="postBox"><br />   <?php refererList(5, 'global', 0, 0, 'no', '', ($blog > 1) ? $blog : ''); ?><br />   <ul><br />    <?php if( count( $res_stats ) ) foreach( $res_stats as $row_stats ) { ?><br />     <li><a href="<?php stats_referer() ?>"><?php stats_basedomain() ?></a></li><br />    <?php } // End stat loop ?><br />    <li><a href="<?php $Blog->disp( 'blogstatsurl', 'raw' ) ?>"><?php echo T_('more...') ?></a></li><br />   </ul></div><br /> <div class="boxTop"><?php echo T_('Top Referers') ?></div><div class="postBox"><br />   <?php refererList(5, 'global', 0, 0, 'no', 'baseDomain', ($blog > 1) ? $blog : ''); ?><br />   <ul><br />    <?php if( count( $res_stats ) ) foreach( $res_stats as $row_stats ) { ?><br />     <li><a href="<?php stats_referer() ?>"><?php stats_basedomain() ?></a></li><br />    <?php } // End stat loop ?><br />    <li><a href="<?php $Blog->disp( 'blogstatsurl', 'raw' ) ?>"><?php echo T_('more...') ?></a></li><br />   </ul><br /> </div><br /><br /> <?php }// --------------------- END OF STATS ---------------- ?><br /><br /><br /><div class="boxTop"><?php echo T_('Syndicate this blog') ?> <img src="../../img/xml.gif" alt="XML" width="36" height="14" class="middle" /></div>               <br /> <div class="postBox"><br />RSS 0.92: <a href="<?php $Blog->disp( 'rss_url', 'raw' ) ?>"><?php echo T_('Posts') ?></a>, <a href="<?php $Blog->disp( 'comments_rss_url', 'raw' ) ?>"><?php echo T_('Comments') ?></a><br /><br /><br />RSS 1.0: <a href="<?php $Blog->disp( 'rdf_url', 'raw' ) ?>"><?php echo T_('Posts') ?></a>, <a href="<?php $Blog->disp( 'comments_rdf_url', 'raw' ) ?>"><?php echo T_('Comments') ?></a><br /><br /><br />RSS 2.0: <a href="<?php $Blog->disp( 'rss2_url', 'raw' ) ?>"><?php echo T_('Posts') ?></a>, <a href="<?php $Blog->disp( 'comments_rss2_url', 'raw' ) ?>"><?php echo T_('Comments') ?></a><br /><br /><br />Atom: <a href="<?php $Blog->disp( 'atom_url', 'raw' ) ?>"><?php echo T_('Posts') ?></a>, <a href="<?php $Blog->disp( 'comments_atom_url', 'raw' ) ?>"><?php echo T_('Comments') ?></a><br /></div>  <br /><br /><!-- Menu footer --><br />    <div id="sideBarFooter"><br />      &nbsp;<br />      <div align="center">powered by<br /><br /><a href="http://b2evolution.net/" title="b2evolution home"><img src="../../img/b2evolution_logo_80.gif" alt="b2evolution" width="80" height="17" border="0" class="middle" /></a></div><br />    </div><br /><br />  </div><br /></div><br />  <!-- Menu end --><br /><!-- Content start --><br /><!-- Main layout container start --><br /><div id="mainContainer"><br />  <div id="content"><br /><br />    <!-- Content header --><br />    <!-- Content blocks start --><br /><!-- ======== START OF MAIN AREA ============ --><br /><br /><?php // ------ START OF POSTS <br />if( isset($MainList) ) $MainList->display_if_empty(); // Display message if no post<br />if( isset($MainList) ) while( $Item = $MainList->get_item() )<br />{<br /> $MainList->date_if_changed('<div class="boxTop">','</div>','')  // you can safely delete this, if you don't want your articles be grouped by date;<br />?><br /><div class="postBox" lang="<?php $Item->lang() ?>"><br /> <?php<br />  locale_temp_switch( $Item->locale ); // Temporarily switch to post locale<br />  $Item->anchor(); // Anchor for permalinks to refer to<br /> ?><br /> <span class="subHeading"><?php $Item->title(); ?></span><br /> <div class="bText"><br />  <?php $Item->content(); ?><br />  <?php link_pages() ?><br /> </div><br />         <div class="bSmallPrint"><br />   .<br />          <a href="<?php echo url_add_param( $Blog->get( 'blogurl', 'htmlattr' ), 'author='. $Item->Author->ID) ?>"><?php $Item->Author->prefered_name();//  the name of the author ?></a><br />          .<br />   <?php $Item->issue_date(); // to show the date of this post ?><br />   .<br />  <a href="<?php $Item->permalink() ?>" title="<?php echo T_('Permanent link to full entry') ?>"><?php $Item->issue_time(); // to show the time of this post ?></a> <?php $Item->wordcount(); ?> Words<br />          .<br />  <?php $Item->categories('true','', '') // categories ?><br />   .<br />          <?php $Item->feedback_link( 'comments' ) // Link to comments ?><br />   <?php $Item->edit_link( ' . ' ) // Link to backoffice for editing ?><br /> </div><br /> <?php // ------------- START OF INCLUDE FOR COMMENTS -------------<br />  $disp_comments = 1;  // Display the comments if requested<br />  $disp_comment_form = 1; // Display the comments form if comments requested<br />  require( dirname(__FILE__).'/_feedback.php' );<br />  // -------- END OF INCLUDE FOR COMMENTS, TRACKBACK, PINGBACK, ETC. ------<br />  locale_restore_previous(); // Restore previous locale (Blog locale)<br /> ?><br /></div><br /><?php } // ---------------------------------- END OF POSTS ------------------------------------ ?><br /><br /><br /><?php // ---------------- START OF INCLUDES FOR LAST COMMENTS, STATS ETC. ----------------<br />switch( $disp )<br />{<br /> case 'comments':<br />  // this includes the last comments if requested:<br />  require( dirname(FILE).'/_lastcomments.php' );<br />  break;<br /> case 'arcdir':<br />  // this includes the archive directory if requested<br />  require( dirname(FILE).'/_arcdir.php');<br />  break;<br /><br /> case 'stats':<br />  // this includes the statistics if requested:<br />  require( dirname(__FILE__).'/_stats.php');<br />  break;<br />}<br />// ------------------- END OF INCLUDES FOR LAST COMMENTS, STATS ETC. ------------------- ?><br /><br /><br />    <!-- Content footer --><br />    <div id="footer"><br />      <div style="padding: 5px">&nbsp;</div><br /><br /> <?php posts_nav_link(); ?><br /> <?php <br />  // previous_post( '<p class="center">%</p>' );<br />  // next_post( '<p class="center">%</p>' );<br /> ?><br /> <br /><br />      &copy; 2005 no rights reserved<br/><br />      design by: <a href="http://www.oswd.org/userinfo.phtml?user=snop" title="OSWD profile">snop</a> | <a href="http://fullahead.org" title="design portfolio">fullAhead.org</a> Evoskin by: <a href="http://www.brendoman.com/dbc">Danny Ferguson</a><br />    </div><br /><br />  </div><br />  <!-- Content end --><br /><br /></div></div><br /><!-- Main layout container end --><br /><br /> </body><br /></html><br /><br /><!-- end code provided by createblog.com -->

^ those are the codes for the display of my main blog page

This post has been edited by YaWeaveIzOnFiyah: Sep 5 2005, 03:06 PM