The top right menu don't display Home as default,....

midiweb

I found the solution:

you have to write in the main css code here :

display:inline;
and
text-align : right;

The navigation part in css:


#nav {
width : 980px;
height : 25px;
border-top : 5px solid black;
background-color : #c59856;
position : relative;
top : 0;
margin : 0;
margin-top : 0;
margin-bottom : 0;
padding-left : 0;
text-align : right;
}
#nav li {
display : inline;
height : 20px;

}
#nav li a {
padding-left : 19px;
padding-right : 12px;
color : white;
text-decoration : none;
font : normal normal normal 10px/20px "Lucida Grande", Lucida, Verdana, sans-serif;
}
#nav li a:hover
{
   color: #050100;
}



and finally I recommend to test your css with the validator css by www.w3.org.

Bye.

midiweb

hi, I tried this trick but it works unfortunetly not.

text-align: right;

I understand clearly "Float".

Here the code for the navigation top menu.
I uncommented some tags intentionnaly.

body
{
   background-color: #fdfffc;
   font-family: Verdana, Geneva, Arial, helvetica, sans-serif;
    font-size: 10pt;
   padding: 0px;
   margin-top: 20px;
}

#nav
{
   width: 980px;
   height: 25px;
   /*border-bottom: 1px solid black;*/
   /*color: white;*/
   background-color:#990000;
   /*opacity: 0.8;
   -moz-opacity: 0.8;
   filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);*/
   position: relative;
   top: 0px;
   margin-left: 0px;    
   /*left: 50%;*/    
   margin-top: 0px;
   margin-bottom:0px;
   padding: 0px;
   text-align:right;

}

#nav li
{
   /*display: block;*/
   float: left;
   height: 20px;
   width: auto;
   /*text-align: center;*/
   line-height: 25px;
}

#nav li a
{

   /*display: block;*/
   padding-left: 12px;
   padding-right: 12px;
   color: white;
   text-decoration: none;
   font: normal normal normal 10px/20px "Lucida Grande", Lucida, Verdana, sans-serif;
}



#nav li a:hover
{
   background-color:;
   color: grey;
}


BerndJM

Why that:
with float: right the order of your items is
... - third - second - first
and with float: left the order is
first - second - third
Maybe you have a look in a CSS Docu what float means.

Forget it, with margin and/or padding
give your #nav a text-align: right; that should do the trick

Regards Bernd
In theory, there is no difference between theory and practice. But, in practice, there is.

midiweb

it works actualy good but the line is left aligned but "Home " ist now default. Why that? I don't know.

so it's:

Home, Terms, Contact, Sitemap, About

instead right aligned

                                                                                          Home, Terms, Contact, Sitemap, About

But you helped me also. Why not change the marging and/or the padding of the line to align it on the right

I try at once

cvc

Hi  :-)

Just a little note : you have to different functions to call up the menu. show_menu and show_menu2. Better to keep it either one, instead of both (as you have right now).

Just my two pennies  :-D

Greetz!

BerndJM

Hi,

just change in your css here:

#nav li {
   display: block;
   float: right;
   height: 20px;
   width: auto;
   text-align: center;
   line-height: 25px;
}

the float: right; to float: left; and look what happens.

Regards Bernd
In theory, there is no difference between theory and practice. But, in practice, there is.

midiweb

thanks. Yes I know that, but I have two menus: one sidebar menu and a top menu and the pages for both are mixed.


In index .php, of the template industry1 the line for the top menu is:


<div class="gear"> </div>
                       <?php show_menu(1,0,1,true,'<li><span[class]>[a][menu_title] [/a]</span>','</li>','<ul id="nav">'); ?>


and for the sidebar:


...
               <div id="sidebar">
                   <div class="subtabs">
                       <?php show_menu2(2,0,1); ?>
                   </div>
</div>


I put the top menu in this order:

Home, Terms, Contact, Sitemap, About

and though the default page displayed is "About" and not Home

The menu is read from right to left.

maybe the CSS can change this problem?

or I have to change sth here but I don't understand the parameters.


<?php show_menu(1,0,1,true,'<li><span[class]>[a][menu_title] [/a]</span>','</li>','<ul id="nav">'); ?>



who can help me?
thanks

cvc

Make sure to put the first page you want to show at the top of your list in the admin -> pages section of your site.

Hope this helps  :-D

midiweb

#1
hi,
I have with the template "industry " a top right menu with the items: Home, Terms, Contact, Sitemap, About
But the problem, the first default page displayed is not Home but About when I enter the site.
I want the home page as default and not another.

Here is the index.php and the css sheet. How and where have I to change this?


<?php

/*

 WebsiteBaker Project <http://www.WebsiteBaker.org/>
 Copyright (C) 2004-2007, Ryan Djurovich

 WebsiteBaker is free software; you can redistribute it and/or modify
 it under the terms of the GNU General Public License as published by
 the Free Software Foundation; either version 2 of the License, or
 (at your option) any later version.

 WebsiteBaker is distributed in the hope that it will be useful,
 but WITHOUT ANY WARRANTY; without even the implied warranty of
 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 GNU General Public License for more details.

 You should have received a copy of the GNU General Public License
 along with WebsiteBaker; if not, write to the Free Software
 Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA  02111-1307  USA

*/

if(!defined('WB_URL')) {
    
header('Location: ../index.php');
    exit(
0);
}

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
   <head>
       <title><?php echo WEBSITE_TITLE?> - <?php echo PAGE_TITLE?></title>
       <meta http-equiv="Content-Type" content="text/html; charset=<?php if(defined('DEFAULT_CHARSET')) { echo DEFAULT_CHARSET; } else { echo 'utf-8'; }?>" />
       <meta name="description" content="<?php page_description(); ?>" />
       <meta name="keywords" content="<?php page_keywords(); ?>" />

       <link href="<?php echo TEMPLATE_DIR?>/industry.css" rel="stylesheet" type="text/css" media="screen" />
   </head>
   <body>
       <div id="main">
           <a name="top" class="nodisplay"></a>
           <div id="hero"> </div>
                       <div id="hero2"> </div>
           <div id="header">
               <!-- <div class="gear"> </div> -->
               <div class="gear"> </div>
                       <?php show_menu(1,0,1,true,'<li><span[class]>[a][menu_title] [/a]</span>','</li>','<ul id="nav">'); ?>

               <h1 class="shad"><em><?php echo WEBSITE_TITLE?></em></h1>
               <h1><em><?php echo WEBSITE_TITLE?></em></h1>
           </div>

           <div id="wrapper">
               <div id="sidebar">
                   <div class="subtabs">
                       <?php show_menu2(2,0,1); ?>
                   </div>
                   <?php 
                        ob_start
();     // start output buffer
                        
global $database;
                        
$limit 10;
                        
$query "SELECT post_id,title,content_short,group_id,link FROM ".TABLE_PREFIX."mod_news_posts ORDER BY position DESC LIMIT 0, $limit;";
                        
$error mysql_error();
                        if (!
$result mysql_query($query)) {
                            print 
"$error";
                            exit;
                        }
                        while(
$data mysql_fetch_object($result)){
                            
$title $data->title;
                            
$id $data->post_id;
                            
$link $data->link;
                            
$short $data->content_short;
                            echo 
'<p><a href="'.WB_URL.'/pages/'.$link.PAGE_EXTENSION.'">'.$title.'</a><br />'.$short.'</p>';
                        }
                        
$foo=ob_get_contents();    // put outputbuffer in $foo
                        
ob_end_clean();             // clear outputbuffer
                    
?>

               </div>
               <div id=aktuelles>
               <?
                   if ($foo<>"") {  // some code to execute cause there is some block
                           echo '<h4>Aktuelles</h4>';
                           echo $foo;
                       } else { // some code for no info
                           echo '<h1>No New News</h1>';
                           }
               ?>
               </div>

               <div id="content">
                   <?php page_content(); ?>
               </div>
                           </div>
           
           <div id="footer">
               <?php page_footer(); ?>
           </div>
       <div style="clear:both;"></div>
   </div>

   </body>
</html>


and the css sheet:


body
{
   background-color: #fdfffc;
   font-family: Verdana, Geneva, Arial, helvetica, sans-serif;
    font-size: 10pt;    
    margin: 0px;
   padding: 0px;
}

#nav
{
   
   width: 980px;
   height: 18px;
   /*border-bottom: 1px solid black;*/
   color: white;
   background-color:#990000;
   /*opacity: 0.8;
   -moz-opacity: 0.8;
   filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);*/
   position: relative;
   top: 0px;
   margin-left: -490px;    
   left: 50%;    
   margin-top: 0px;
   margin-bottom:0px;
   padding: 0px;
}

#nav li
{
   display: block;
   float: right;
   height: 20px;
   width: auto;
   text-align: center;
   line-height: 25px;


}

#nav li a
{

   display: block;
   padding-left: 12px;
   padding-right: 12px;
   color: white;
   text-decoration: none;
   font: normal normal normal 10px/20px "Lucida Grande", Lucida, Verdana, sans-serif;

}

#nav li a:hover
{
   background-color: #666666;
}

#main
{
   font-family: Verdana, Geneva, Arial, helvetica, sans-serif;
    font-size: 9pt;
   width: 980px;
   margin-left: auto;
   margin-right: auto;
   border-right: 1px solid #666666;
   border-left: 1px solid #666666;
}

#hero
{
   margin: 0px;
   width: 200px;
   height: 92px;
   background-image: url(../../media/jurgschat-banner2.jpg);
   background-repeat: no-repeat;
   float: left;
   
   }
/*#hero1
{
   margin: 0px;
   width: 200px;
   height: 92px;
   margin-left: 160px;
   background-image: url(../../media/muster-banner.png);
   background-repeat: no-repeat;
   float: left;
   
   }*/

#hero2
{
   margin: 0px;
   margin-left: 220px;
   height: 92px;
   background-image: url(../../media/top-banner2.png);
   background-repeat: no-repeat;
   
   }


/*#header
{
   background-image:;
   height: 79px;
   padding-top: 1px;
   position: relative;
}*/

.gear
{
   width: 970px;
   height: 2px;
   margin-top: 0px;
   margin-left: 5px;
/*
   border-bottom: 2px dotted #000;

*/}

#header h1
{
   position: absolute;
   left: 74px;
   top: 8px;
   color: white;
   font-size: 48px;
   font-weight: bold;
   margin: 0px;
}

/*#header h1.shad
{
   left: 76px;
   top: 10px;
   color: black;
   opacity: 0.7;
   -moz-opacity: 0.7;
   filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}*/

#header em
{
   font-style: normal;
   text-decoration: underline;
}

#wrapper
{
   padding-top: 1px;
   background-color: white;
   position: relative;
}
#wrapper:after {
content: '.';
display: block;
height: 0;
clear: both;
visibility: hidden;
}
#wrapper {
display: inline-block;
}
\
#wrapper {
display: block;
}

#sidebar
{
   float:left;
   text-align: center;
   margin-left: 0;
   margin-top: 0px;
   position: relative;
   background-position: bottom left;
   padding: 10px 10px 20px 10px;;
   background-color:white;
   width: 160px;
   height: 450px;
   border-right: 1px inset grey ;
   
}
#aktuelles
{
   float:right;
   text-align: center;
   margin-left: 0px;
   margin-top: 0px;
   position:relative;
   background-position: bottom left;
   padding: 10px 10px 20px 10px;
   background-color:white;
   width: 160px;
   height: 450px;
   border-left: 1px inset grey;
   
}


#aktuelles h4
{
   
   background-color:orange ;
   
}
#sidebar h3
{
   font-size: 18px;
   border-bottom: 1px solid black;
   margin-bottom: 4px;
   margin-top: 16px;
   clear: both;
}

#sidebar ul
{
   margin-left: 1em;
   padding-left: 0px;
}

#sidebar p
{
   margin-bottom: 8px;
}
    #sidebar div.subtabs ul{
   list-style: none;
   width: 155px;
   margin: 0;
   padding: 0;
   }
   #sidebar div.subtabs ul ul{
   list-style: none;
   width: 130px;
   margin: 0;
   padding: 0 0 0 5px;
   }
   #sidebar div.subtabs ul ul ul{
   list-style: none;
   width: 125px;
   margin: 0;
   padding: 0 0 0 5px;
   }
   #sidebar div.subtabs ul a{
   width:100%;
   margin: 3px;
   text-align:left;
   font-size: 0.9em;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   font-weight: normal;
   text-decoration:none;
   word-wrap:normal;
   color:;
   display:block;
   padding:3px 3px 3px 5px;
   /*background:#f4f4f4;*/
   /*border-top:1px solid #d8d8d8;*/
   /*border-right:1px solid #d8d8d8;*/
   border-bottom:1px solid #d8d8d8;
   border-left:4px solid #cccccc;
   }
   #sidebar div.subtabs ul a:hover {
   text-decoration:none;
   background:#eaeaea url(img/menubg2.gif) bottom left repeat-x;
   color:#A31E00;
   /*border-top:1px solid #b0b0b0;
   border-right:1px solid #b0b0b0;
   border-bottom:1px solid #b0b0b0;*/
   border-left:4px solid #A31E00;
   }
   
#content
{
   margin: 0 0 0 180px;
   min-height:310px;
   height:auto !important;
   height:300px;
   width:600px;
   display: block; 
   position: relative;
   padding: 0px 3px 20px 10px;
   color: #333333;
   
}

#content h1
{
   font-size: 20px;
   /* 18px is the default minimum font size for which anti-aliasing will occur. */
   margin: 0px;
   text-decoration: underline;
}

#content h2
{
   font-size: 18px;
   /* 18px is the default minimum font size for which anti-aliasing will occur. */
   margin: 0px;
   text-decoration: underline
}

#content .date
{
   float: right;
}

#content .postedBy
{
   float: left;
}

#content .meta
{
   height: 1em;
}

#content p
{
   text-align: justify;
   text-indent: 1em;
   line-height: 1.3em;
}

.comments
{
   border-top: 1px dotted #666666;
   border-bottom: 1px dotted #666666;
   padding: 4px;
   text-align: right;
   margin-bottom: 2em;
   background-image: url(images/comment_edit.gif);
   background-repeat: no-repeat;
   background-position: center left;
}

a
{
   color: #666666;
}

.pullout
{
   background-color: #eeeeee;
   padding: 5px;
   float: right;
   margin: 8px;
}




#footer
{
   width: 980px;
   height:45px;
   padding-top: 5px;
   padding-bottom: 5px;
   margin-left: auto;
   margin-right: auto;
   
   color: #b0b0b0;
   background-image:url(../../media/Jurgschat-footer.png);
}

.left
{
   float: left;
}

.right
{
   float: right;
}

.csskeyword
{
   color: blue;
}

.cssvalue
{
   color: red;
}

p.caption
{
   text-align: center;
}

small.super
{
   vertical-align: top;
   font-size: 0.75em;
   line-height: 1.3em;
}

.nodisplay
{
   display: none;
}


thanks for help