Author Topic: Need help centering a menu where theme css blocks it  (Read 591 times)

0 Members and 1 Guest are viewing this topic.

Offline vinnierTopic starter

  • Enthusiast
  • Posts: 56
    • View Profile
Need help centering a menu where theme css blocks it
« on: March 10, 2010, 12:07:34 PM »
Hi folks!

Need some help with this theme in wordpress, as you can see on the file attached there is a menu bar at the top. I want to center it cause it doesn't look good.
When I attempt to center it in the menu.php file from the theme using <p style="text-align: center;"> nothing happens... It has to be overridden by something... Only I don't know what.
How can I bypass it and center the menu?

Here is the css:
Code: [Select]
/* 
Theme Name: State Of Mind
Theme URI: http://the-cloisters.net/themedemos/?SelectedTheme=State+Of+Mind
Description: 3 Column Split, widget-ready theme reminiscent of Old World Style with red leather and wood highlights.  Fixed width featuring an author box, author info page, gravatars and along with custom Archives, Sitemap and full width No Sidebars page templates.  Tested in Firefox, Opera, Safari, IE6 and IE7. Compatible up to WP 2.7.
Version: 1.2
Author: Mina
Author URI: http://www.the-cloisters.net/
Tags: three-columns, fixed-width, threaded-comments, dark, red, brown, tan

*/



/***** TYPOGRAPHY AND LINKS *****/
body, address, dd, dl, hr, p, form { font-family: "Trebuchet MS", Verdana, Tahoma, Arial, Sans-serif; margin: 0; padding: 0; }
h1, h2, h3, h4, h5, h6 { font-family: Georgia, Times, Verdana, Tahoma, Arial, Sans-serif; margin: 0; padding-left: 5px; color: #61574a; }

h1 { font-size: 24px; }
h2 { font-size: 14px; }
h3 { font-size: 12px; }
h4 { font-size: 10px; }

a:link, a:visited { text-decoration: none; color: #574f4b; }
a:hover { text-decoration: underline; color: #660000; }
p { padding: 10px; }
blockquote { margin: 15px 30px 10px 30px; padding: 0 20px 10px 20px; border-left: 2px solid #574f4b; border-right: 2px solid #574f4b; }

/***** MAIN CONTENT *****/
body { margin: 0; font-size: 11px; text-align: center; vertical-align: top; background: #333; color: #544b40; }
#wrapper { margin: 0 auto 0 auto; width: 990px; text-align: left; }
#main_content { background: #f1efe4 url(images/content_bg.jpg); float: left; margin: 0 auto 0 auto; padding: 0; width: 990px; }
#container { float: left; width: 530px; margin: 15px 0 0 20px; padding: 10px; border: #dcd7bc 1px solid;  border-top: none; border-bottom: none; }
#container_wide { float: left; width: 900px; margin: 15px 0 0 30px; padding: 5px 5px 0 7px; }
.post { padding: 15px 0 5px 0; }
.post h2 { font-family: Georgia, Trebuchet MS, Sans-serif; font-size: 16px; margin-left: 5px; }
.entry { line-height: 14px; }
.postmetadata { margin: 10px 0 0 0; font-size: 9px; }
.date { font-size: 9px; }

#author-box { width: 90%; min-height: 115px; margin: 10px 10px 20px 10px; padding: 10px; background: none; border: 3px double #574f4b; }
#author-box .avatar { float: left; width: 80px; height: 80px; }
#author-box h2, #author-box h4 { color: #61574a; background: none; border: none; padding-bottom: 5px;}

/***** HEADER *****/
#header { float: left; width: 990px; height: 175px; background: #660000 url(images/header.jpg) no-repeat; padding: 0; margin: 0 auto 0 auto; }
#header h1 { padding: 0; margin: 45px 15px 0 ; font-family: Times New Roman, Georgia, Sans-serif; font-size: 36px; font-variant: small-caps; line-height: 38px; text-align: center; }
#header h1 a { text-decoration: none; color: #eae7b3; text-align: center; }
#header h1 a:hover { text-decoration: none; color: #eae7b3; }
#header .description { margin: 10px 0 0 0; padding: 0; font-size: 12px; font-weight: bold; font-style: italic; color: #eae7b3; text-align: center;  }

/***** HORIZONTAL MENU *****/
.menu  { float: left; width: 953px; height: 30px; margin-left: 19px; padding: 0; display: inline; background: url(images/menu_bg.gif) no-repeat; border-top: #61574a 3px double; }
.menu ul { width: 100%; margin: 0; padding: 8px 0; list-style: none; }
.menu ul li { display: inline; margin: 0; }
.menu ul li a { padding: 0 0 0 10px; text-decoration: none; color: #000; font-family: Times New Roman, Georgia, Sans-serif; font-variant: small-caps; font-weight: bold; font-size: 14px; }
.menu ul li a:hover { color: #660000; text-decoration: underline; }

/***** IMAGES *****/
p img { padding: 0; max-width: 100%; }
a img { border: #d4be87 1px solid; padding: 3px; background: none; }
img.centered { display: block; margin-left: auto; margin-right: auto; }
img.alignright { padding: 4px; margin: 0 0 2px 7px; display: inline; }
img.alignleft { padding: 4px; margin: 0 7px 2px 0; display: inline; }
.alignright { float: right; }
.alignleft { float: left; }
.aligncenter, div.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.wp-caption { border: 1px solid #ddd; text-align: center; background-color: #f3f3f3;   padding-top: 4px; margin: 10px; /* optional rounded corners for browsers that support it */ -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px;    border-radius: 3px; }
.wp-caption img { margin: 0; padding: 0; border: 0 none; }
.wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; padding: 0 4px 5px; margin: 0; }
img.avatar { float:left; margin: 5px; border: #afb997 1px solid; }
#flickrrss img { border: 1px solid #61574a; float: left; margin: 0 0 3px 3px; }

/***** NAVIGATION *****/
.navigation { padding: 15px 0 15px 10px; font-size: 9px; font-weight: bold; line-height: 18px; }

/***** SUBSCRIPTION *****/
.subscribe  { background: url(images/feed-icon.jpg) no-repeat 2% center; width: 25px; margin: -20px 0 0 40px; padding: 6px 0 6px 15px; text-decoration: none; }
.subscribe a:hover { text-decoration: none; }

/***** SIDEBAR *****/
#left_sidebar h2, #right_sidebar h2, #commentblock h2 { color: #eae7b3; font-family: Times New Roman, Georgia, Verdana, Tahoma, Trebuchet MS, Sans-Serif; font-size: 14px; font-variant: small-caps; font-weight: bold; margin: 15px auto 10px auto; padding: 3px; border: #000 1px solid; text-align: center; background: url(images/sidebar_head.gif); }

#left_sidebar ul li a:hover, #right_sidebar ul li a:hover { color: #660000; }
#left_sidebar a.title, #right_sidebar a.title { color: #6b6b47; padding: 0px; margin: 0px; }
#left_sidebar ul li a, #right_sidebar ul li a { display: inline; font-size: 11px; font-family: Verdana, Times, Sans-Serif; color: #544b40; text-decoration: none; margin: 0; padding: 0; }
#left_sidebar ul li, #right_sidebar ul li { display: block; padding: 0; margin: 0px; font-size: 10px; color: #6b6b47; }
#left_sidebar ul ul, #right_sidebar ul ul { margin:0 0 0 10px; }
#left_sidebar ul ul ul, #right_sidebar ul ul ul { margin:0 0 0 10px; }

#left_sidebar { width: 160px; float: left; margin: 20px 0 20px 35px; padding: 10px auto 0 auto; }
*html  #left_sidebar { margin: 20px 0 20px 20px; padding: 10px auto 0 auto; }
#left_sidebar ul { list-style: none; margin: 0 0 5px 0; padding: 0; }

#right_sidebar { width: 170px; float: left; padding: 10px auto 0 auto; margin: 20px 25px 20px 15px; }
#right_sidebar ul { list-style: none; margin: 0px; padding: 0; }

/***** SEARCH *****/
#searchform { margin: 10px auto; padding: 5px 3px; text-align: center; }
#sidebar #searchform #s { width: 108px; padding: 2px; }
#sidebar #searchsubmit { padding: 1px; }

/***** Calendar *****/
#wp-calendar { text-align:center; background:#dcd7bc; margin:0 0 10px 0;
padding:0; width: 85%; border: #61574a 3px double; font-variant: small-caps;
font-family: Times, Verdana, Sans-Serif; }
#wp-calendar td { line-height:10px; font-size:10px; color:#333; font-variant:  small-caps; }
#wp-calendar td a { display:block; color:#333; text-decoration:none; line-height:10px;
font-weight:bold; font-variant: small-caps; font-size:10px; }
#wp-calendar #prev a { width:30px; font-variant: small-caps; }
#wp-calendar #next a { width:30px; margin:0 0 0 30px; font-variant: small-caps; }
#wp-calendar #today { background:#600000; color:#d7d7bf; font-variant: small-caps; }
#wp-calendar #today a { color:#d7d7bf; font-weight:700; font-variant: small-caps; }
#wp-calendar caption { text-align: center; width: 85%; margin: 5px 0 5px 0; font-variant: small-caps; font-family: Times, Verdana,Sans-Serif; font-size:12px; }

/***** COMMENTS *****/
.comments-template { margin: 0 10px; border-top: 1px solid #dcd7bc; padding: 0 10px; }
.comments-template ol { margin: 0; padding: 0 0 15px; list-style: none; }
.comments-template ol li { margin: 0; line-height: 14px; padding: 10px 0 10px 5px; }
.comments-template h2, .comments-template h3 { font-family: Georgia, Sans-serif; font-size: 12px; margin: 20px 0 0 0; }
.commentmetadata { font-size: 9px; }
.comments-template p.nocomments { padding: 0; }
.comments-template textarea { width: 95%; max-width: 500px; font-family: Arial, Helvetica, Georgia, Sans-serif; font-size: 11px; background: #efeadc; }
.authorcomment { background: #bab195; }

/***** FOOTER *****/
#footer { clear: both; float: left; width: 990px; height: 55px; margin-top: 10px; padding: 0; background: url(images/footer.jpg) no-repeat; }
#footer p { font-size: 9px; line-height: 18px; padding: 0 10px 0 10px; text-align: center; color: #544b40; }
#footer a { color: #6b6b47; }


Here is the html file responsible;

Code: [Select]
<?php if(function_exists('wp_page_menu')) : ?>
            <?php wp_page_menu ('show_home=1&depth=1&title_li='); ?>
          <?php else : ?>
  <div class="menu">   
        <ul>
            <li><a href="<?php echo get_settings('home'); ?>">Home</a></li>
           <?php wp_list_pages('depth=1&title_li='); ?>                 
        </ul>   
  </div>     
<?php endif; ?>



Help  :(



[attachment deleted by admin]

Offline vinnierTopic starter

  • Enthusiast
  • Posts: 56
    • View Profile
Re: Need help centering a menu where theme css blocks it
« Reply #1 on: March 10, 2010, 06:58:07 PM »
Anyone? Any ideas? PLease help  :(  :shrug:

Offline haku

  • Guru
  • Freak!
  • *
  • Posts: 5,707
  • Old Man
    • View Profile

Offline vinnierTopic starter

  • Enthusiast
  • Posts: 56
    • View Profile
Re: Need help centering a menu where theme css blocks it
« Reply #3 on: March 11, 2010, 06:11:18 AM »
thanks but I don't really know how is this supposed to help... The html, <ul> and <li> tags are already used in my menu file and the money isn't centered... Firebug shows that the css is overridden by something.... :/

Offline haku

  • Guru
  • Freak!
  • *
  • Posts: 5,707
  • Old Man
    • View Profile
Re: Need help centering a menu where theme css blocks it
« Reply #4 on: March 11, 2010, 08:54:00 AM »
It's supposed to help because it shows how to center an item list, which is what you are looking to do.

Offline XeNoMoRpH1030

  • Enthusiast
  • Posts: 71
    • View Profile
    • Blue Line Attack
Re: Need help centering a menu where theme css blocks it
« Reply #5 on: March 11, 2010, 09:20:57 AM »
You should be able to center it by using:
Code: (css) [Select]
.menu ul { margin: 0 auto; padding: 8px 0; list-style: none; }

Which you could have found in the link haku posted.
« Last Edit: March 11, 2010, 09:22:02 AM by XeNoMoRpH1030 »

Offline vinnierTopic starter

  • Enthusiast
  • Posts: 56
    • View Profile
Re: Need help centering a menu where theme css blocks it
« Reply #6 on: March 11, 2010, 08:03:07 PM »
Thank you guys but it seems that I am stupid... :/ Where do I put this? I have tried to put it in the css file and nothing happened... :/