CSS - [wordpress] Remove Categories From Page Help
I'm using a free template that is utilizing a custom font called "chewy" I have custom font "Fortuna dot" that I'd like to use instead, however the only way I've found online to edit this is using a plugin. There must be a way to do it without a plugin because the template is doing so. Can any one help?
Also I would like to remove the categories from the page and move the navigation bar there instead. Please please help me. I have the CSS for dummies book and I still can't figure it out. SITE: havenhart[dot]com Similar TutorialsI tried a bunch of stuff to fix this. I only removed the sidebar from the pages, not the blog. This is how the footer is SUPPOSED to look: http://www.regionalcreations.com/fotografix/?page_id=4 This is how it looks on the pages: http://www.regionalcreations.com/fotografix/ For some reason the footer is up inside the body. Help? All I did was comment out the sidebar like this: Code: <!-- </div class="art-sidebar1"> <?php include (TEMPLATEPATH . '/sidebar1.php'); ?> </div> --> And copy the css for the width and change the name and values: Code: .page-contentLayout .page-content { position: relative; margin: 0; padding: 0; border: 0; float: left; overflow: hidden; width: 876px; } .page-contentLayout .page-content-wide { position: relative; margin: 0; padding: 0; border: 0; float: left; overflow: hidden; width: 875px; } Hi, I am new at this. I am using a software to create my website . I dont want the customer to see a shipping option on the checkout page as my product cannot be shipped. How do I remove the shipping information part and show only the billing information from the checkout page? Someone gave me this css: <style type="text/css"> #DisplayShippingSpeedChoicesTD { display: none !important; } #CalcShippingDivContainer { display: none !important; } </style> Where should I put this css? SHould it go in the main css file or html template? Any particular location in the css? Thanks Hi there, Not entirely sure this is a CSS issue, but something tells me it is... I'm getting a weird space at the top of my pages in IE, which consequently causes the header to not align properly with the header background image. It works just fine with FireFox though. You can view the issue he http://hsdc.groundedgroup.com/ Does anybody know how to remove this space? Thanks in advance. hello, this will perhaps sound like a crazy thing to do, but i am trying to style my nested list(s) in order for the 'category' to appear below its children. so rather than having, for example sport football cricket formula one i have football cricket formula one sport the reason for trying this is that i am hoping to display my lists at various positions along a base line (over a bg image) and certain positions within the image require the category name to be under the 'children'. is it possible though? i tried making the inner list's position to be relative and adjusting the top position to -20 etc but of course this brings the children up rather than push the category down. here is an example of my nested list Code: <ul> <li>sport <ul class="up"> <li>football</li> <li>f1</li> </ul> </li> <li>music <ul class="up"> <li>stuff</li> <li>stuff2</li> </ul> </li> </ul> it probably isn't possible but i thought i would ask before giving up on the idea completely. thank you for your time Here is the blog page: wavgirl.com/blog If you open it in firefox or other browsers, it works fine. The menu at the top is on all pages on my site (via a php include). All pages also are linked to a main stylesheet for my website. Everything works in internet explorer EXCEPT that blog page (if you go to the main page of my site in IE, it loads fine). This has led me to conclude that there is something specifically in the blog's style sheet that doesn't work in IE. When you load the blog page in IE, the page is thrown off center, and the menu dropdown does not work anymore. Can someone simply look at this stylesheet and tell me how to correct it for internet explorer? As I said, all of this loads fine in other browsers, and the menu works on all other pages of the site in any browser. Any help would be appreciated, and I apologize if I posted this in the wrong place. Code: /* Theme Name: Simple Blog Design Theme URI: Description: A simple clear theme with 2-sidebar and 3-sidebar layouts. Version: 1.0 Author: BlogDesignStudio Author URI: http://blogdesignstudio.com/ Tags: widget ready, white, blue, right sidebar Valid XHTML 1.0 Transitional */ * { margin: 0; padding: 0; } body { color: #000; background: #fff; font-family: Verdana, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif; font-size: 70%; line-height: 1.6; } p { font-size: 1.1em; margin: 0 0 10px 0; } blockquote { background: url(images/quote.png) no-repeat; color: #000; margin: 15px; padding-left: 25px; } em { font-style: italic; } strong { font-weight: 700; } pre, code { font-family: Verdana, "Courier New", Courier, Monospace; line-height: 1.5; } pre { border-top: 1px solid #ccc; white-space: pre; overflow: auto; margin: 0 15px; padding: 10px 15px; max-height: 300px; } img { } a { color: #555555!important; text-decoration: none; outline: none; } a:focus, a:hover { color: #555555!important; text-decoration: none; } .clear { float:none; clear: both; } .aligncenter, div.aligncenter { display: block; margin-left: auto; margin-right: auto; } .alignleft { float: left; } .alignright { float: right; } .wp-caption { border: 1px solid #ddd; text-align: center; background-color: #f3f3f3; padding-top: 4px; margin: 10px; } .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.alignleft { margin:5px 10px 10px 0; } img.alignright { margin:5px 0 10px 10px; } hr { background: #E6E6D2; color: #E6E6D2; clear: both; float: none; width: 100%; height: .1em; margin: 0 0 1.4em; border: none; } hr.space { height: 4em; } .clearer { clear:both; } /************************* HOLDERS ********************************/ .container { text-align: left; background: #fff; min-height: 100%; max-width: 1000px; padding-left: 20px; padding-right: 20px; margin: 0; margin: 0 auto; } .container2 { width: 100%; margin: 0 auto; text-align:left; } /************************* HEADER ********************************/ .blender { background: #eae0da; } #header { width: 100%; } #header .container { width: 980px; } #headline { float:left; margin:15px 0 20px 20px; font-size:16px; color:#a6a379; } #headline h1 { font-size:40px; line-height:40px; margin:0; color:#3e4b54; letter-spacing:-1px; } /************************* SUBSCRIBE START ********************************/ .subs { display:block; float:right; width:280px; } .subs a { margin:10px 0 0 0; padding:0 0 0 25px; height:20px; display:block; float:left; background:url(images/rss.gif) left top no-repeat; } /************************* SUBSCRIBE END ********************************/ /************************* PAGES MENU START ********************************/ .topline { height:40px; background:#3E4B54; } ul.menu { width:980px; list-style-type: none; margin: 0px auto; padding:0; font-weight:normal; height:40px; } ul.menu li.page_item { float: left; display: inline; font-size: 18px; margin:0 1px 0 0; padding:0; text-transform:uppercase; } ul.menu li.page_item a { color:#fff!important; display: block; float:left; text-decoration: none; padding:6px 20px 5px 20px; } ul.menu li.page_item a:hover { color: #3e4b54!important; text-decoration:none; background:#E6E2D9; } ul.menu li.current_page_item a { color: #3e4b54!important; text-decoration:none; background:#E6E2D9; } /************************* PAGES MENU END ********************************/ /* Search */ #searchform { padding:0; margin:10px 0 0 0; display:block; float:left; clear:both; width:250px; height:33px; font-size:15px; color:#003e4f; } input#s { width: 240px; float:left; margin:5px 7px 0 0; padding:4px 5px 6px 5px; font-family: Verdana, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif; border:none; font-size:14px; background:#fff; color:white; } /************************* CONTENT PACKER ********************************/ #leftcolumn, #rightcolumn { margin:0; } #leftcolumn { float: left; width: 70%; padding:0; } #leftcolumn_top { height:6px; margin-bottom:15px; } #leftcolumn_bot { height:6px; margin-top:30px; } #rightcolumn { float: right; width: 29%; margin:0; } .sidebar_left { display:none; } /************************* CONTENT START ********************************/ .title { margin:0; clear:both; } .title h2 { color: #3e4b54; } .title h2 a { color: #3e4b54!important; text-decoration: none; } .title h2 a:hover { color: #3e4b54!important; text-decoration: none; border-bottom:1px dotted #3e4b54!important; } .date { color:#555555; margin-bottom:10px; } .post { padding: 0; margin:0 23px 10px 20px; clear:both; } .post p { padding:0; margin:0; } .postdata { margin: 10px 0 20px 0; padding:0 10px 3px 10px; float:left; font-size:12px; background:#eae0da; color:#000; width:97%; } a.more-link { display:block; clear:both; color:#a6a379; margin:10px 0 20px 0; width:135px; } a:hover.more-link { color:#a6a379; } #related h3, h3#comments { padding: 8px 0 5px 0; border-bottom:1px dotted #999; } .cmd-avatar { clear: none; display: inline; float: right; margin: 0px; } /************************* CONTENT END ********************************/ /************************* SIDEBAR MAINS START ********************************/ ul.sidebar { list-style-type: none; margin: 0 0 0px 0; padding: 0; } .sidebar li { padding:0; margin:0; } li.widget ul { list-style-type: none; margin: 0 0 30px 0; padding: 0; font-size:15px; } .sidebar ul li { margin: 5px 0 5px 0; } .sidebar .children { margin: 0 0 10px 10px; } .sidebar h2 { letter-spacing:-1px; } .sidebar a { color: #000!important; padding:4px 5px 6px 15px; font-size:14px; background-position:0 6px; } .sidebar a:hover { color:#555555!important; background-position:0 6px; } /************************* SIDEBAR MAINS END ********************************/ #tag_cloud { display:block; margin-bottom:30px; float:left; clear:both; width:100%; } ul#recentcomments { width:210px; } ul#recentcomments li { background-position:0 5px; padding-left:15px; } #recentcomments a { background:none; padding-left:0; } #recentcomments a:hover { background:none } #tag_cloud a { margin-right:5px; } /************************* COMMENTS AREA START ********************************/ .commentlist { margin: 0; padding:0; list-style-type:none; } .commentlist p { padding:5px; margin:0; } .komentar { margin:0; padding:0; } .commentlist a { border-bottom:1px dotted; } .commentlist a:hover { text-decoration:none; border-bottom:none; } .commentlist .body { padding: 0; margin:0; overflow: hidden; float:right; width:580px; display:block; text-align:justify; color:#45322f; } .commentlist .body .body-author { padding: 0; margin:0; overflow: hidden; color:#555555; float:left; display:block; } .commentlist .body p { float:left; padding-top:0; } .commentlist li { width: 100%; padding: 0 0 5px 0; clear:both; display:block; float:left; font-size:11px; } .commentlist li .top { color: #45322f; padding: 0; margin:0; width:575px; float:right; font-weight: bold; } .commentlist li .top a { color: #555555; } .commentlist li .top span { font-size: 0.9em; font-weight: 400; color:#505e66; } .gravatar { height:70px; width:60px; float:left; margin:0; } img.avatar { margin:0; height:60px; width:60px; padding:2px; border:1px solid #E5E1DE; } .theform { padding: 1.5em 0 2em; } .theform label { font-size: 0.9em; vertical-align: middle; } #remember, #forget, #txpCommentHelpLink { margin-left: 2em; } #commentform { padding:0; } #commentform input:focus, #commentform textarea:focus { border: 1px solid #CECABE; background: white; } .comment_input { vertical-align: middle; width: 260px; border: 1px solid #ffffff; background: #ffffff; padding: 0.3em; margin-right: 5px; margin-bottom:10px; } .message_input { font-size: 1em; width: 98%; height: 200px; border: 1px solid #CECABE; background: #ffffff; margin-top: 0.2em; margin-bottom:10px; padding: 0.3em; } .commentlist_error { color: #c00; } .button { background: #fff; width:75px; padding:5px 0 5px 0; border:1px solid #CECABE; color:#6000; font-weight:bold; text-transform:uppercase; font-size:12px; cursor:pointer; } .button:hover { background: #555555; color:white; cursor:pointer; } #commentform .button:focus { background: #cccccc; color:white; cursor:pointer; border:1px solid #CECABE; } /************************* COMMENTS AREA END ********************************/ /************************* FOOTER START ********************************/ #footer { width: 992px; margin:0px auto; padding:10px 0 20px 0; display: block; } #footer .container { padding:0; width:950px; } .copyright { float:left; color:#a4a093; font-size:11px; margin-bottom:10px; } #footer .credits { float:left; color:#a4a093; } #footer .credits p { float:left; font-size:12px; margin:6px 5px 0 0; } #footer .credits a, #footer .credits a:visited { text-decoration:none; } a.wordpress { display:block; float:left; width:25px; height:25px; background:url(images/wordpress.gif) no-repeat; color:#ccc!important; padding-left:26px; line-height:30px; } a:hover.wordpress { background:url(images/wordpress.gif) no-repeat 0 100%; color:#000!important; } /************************* FOOTER END ********************************/ /*************** SOCIAL LINKS ************************/ .inside_subpost { display:block; clear:both; margin:30px 23px 30px 20px; padding:0; } .related_rss_icon { float:left; background:url(images/rss.gif) no-repeat; width:25px; height:20px; border-bottom:none; } .related_rss { padding:0; margin:0 0 20px 0; font-size:18px; font-weight:normal; border-bottom:none; } .related_rss a, .related_rss a:visited { border-bottom:1px dotted; } .related_rss a:hover { border-bottom:none; text-decoration:none; } .social { margin:0; padding:0; float:left; margin-right:30px; } /*************** END SOCIAL LINKS ************************/ #calendar_wrap { margin:0px auto; width:210px; margin-bottom:30px; clear:both; } #calendar_wrap a { padding: 3px 0px; background:none } #calendar_wrap table { width: 210px; border: solid 1px #ccc; background:#f7f7f7} #calendar_wrap caption { padding: 5px 0px; width: 210px; color:#585449; font-size:14px; font-weight:bold; } #calendar_wrap table th { text-align: center; letter-spacing: -1px; padding: 0px; font-size:12px; color:#585449; height:30px; } #calendar_wrap table td { text-align: center; border: solid 1px #ccc; padding: 3px; font-size: 12px; color:#585449} #calendar_wrap table td a { font-size: 12px; font-weight:bold;} #calendar_wrap table td a:hover { color:#9CC318; font-weight:bold; border:none; } /* Page Navigation +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ .pageNav { padding: 5px 0 0 0; margin:30px 23px 20px 20px; height:30px; font-size:15px; } .pageNav a, .pageNav a:visited { display:block; float:left; text-align:center; line-height:25px; height:25px; width:25px; color:#3A3A3A; text-decoration:none; } .pageNav a:hover { text-decoration: none; color:#a6a379; border-bottom:1px dashed #a6a379; } .pageNav span { display:block; float:left; text-align:center; line-height:25px; height:25px; width:130px; color:#333;} .pageNav .on { display:block; float:left; text-align:center; line-height:25px; height:25px; width:25px; color:#a6a379; } .dotts {width:25px; text-align:center; display:block; float:left;} .pageNav a.lastpage {color: #3a3a3a;width:35px;} .pageNav a:hover.lastpage {color: #222; width:35px;} #singleNav { margin:20px; } .previous { float:left; } .next { float:right; } .list404-table { font-size:17px; } ul.list404, ul.list404 li ul { list-style-type:none; font-size:14px; margin:10px 20px 20px 20px; } ul.list404 li a { background-position:0 4px; padding-left:20px; } ul.list404 li a:hover { background-position:0 4px; } I'm using wordpress 2.9 and I installed a plugin called wp-polls the problem is that the Y in Yes and N in No on the poll won't show up in IE. the url is mcs.assistui.net How do you fix this? I'm trying to edit a free Wordpress theme called "Imprezz 1.3" so that the date of each post is displayed about 20 pixels more to the left. Here's a picture of what I'm going for: i.imgur.com/l2EyM.png I've tried to mess with positioning and z-index in the stylesheet for .postTime, .postDay & .postEra without much success (I get the div to move but the part that's supposed to be 'sticking out' of the page doesn't show). Any help would be much appreciated! Thx I know this probably has a really simple answer but how do I make it so the sidebar is on the right side of the content box on a WordPress theme? Here is what it looks like right now: http://reptilenewsstation.1sthoster.com/ The sidebar is below the content box and I want it to be on the right side of the content box. I know the theme sucks right now but this is my first WordPress theme and I want to set everything up in the correct places before I start getting into really styling it. if you look at my web page http://www.invalidheart.org/index.php when i have two or more entries my layout looks totally messed up, when i just have one entry, everything is fine. I can't for the life of my figure out what's going wrong with my template when i have 2+ posts. this is my index.php which is the template for wordpress: Code: <?php /* Don't remove this line. */ require('./wp-blog-header.php'); ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head profile="http://gmpg.org/xfn/1"> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Invalid Heart - The Portfolio</title> <meta http-equiv="Content-Type" content="text/html; charset=<?php bloginfo('charset'); ?>" /> <meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> <!-- leave this for stats --> <style type="text/css" media="screen"> @import url( <?php wp_stylesheet("default"); ?> ); </style> <!-- compliance patch for microsoft browsers --> <!--[if lt IE 7]> <script src="http://www.invalidheart.org/ie7-standard.js" type="text/javascript"> </script> <![endif]--> <link rel="stylesheet" type="text/css" media="print" href="<?php echo get_settings('siteurl'); ?>/print.css" /> <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" /> <link rel="alternate" type="text/xml" title="RSS .92" href="<?php bloginfo('rss_url'); ?>" /> <link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="<?php bloginfo('atom_url'); ?>" /> <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" /> <?php wp_get_archives('type=monthly&format=link'); ?> <?php //comments_popup_script(); // off by default ?> <?php wp_head(); ?> </head> <body id="sectionone"> <?php if ($posts) : foreach ($posts as $post) : start_wp(); ?> <div id="wrap"> <div id="header"></div> <div id="container"> <div id="menu"><?php include ("menu.php"); ?></div> <div id="extra"> <h3>Navigation</h3> <div class="line"></div> <div class="item"> <ul class="nav"> <?php include ("navigation.php"); ?> </ul> </div> <h3>Change Style</h3> <div class="line"></div> <div class="item"> <ul class="nav2"> <?php wp_style_switcher(0); ?> </ul> </div> <h3>Recent Posts</h3> <div class="line"></div> <div class="item"> <ul class="nav2"> <?php get_recent_posts(); ?> </ul> </div> <h3>Archives</h3> <div class="line"></div> <div class="item"> <ul class="nav2"> <?php wp_get_archives('type=monthly'); ?> </ul> </div> <h3>Links</h3> <div class="line"></div> <div class="item"> <ul class="nav2"> <?php include ("links.php"); ?> </ul> </div> </div> <div id="main"> <h3>News & updates</h3> <div class="line"></div> <div class="item"> <?php the_date('','<h4>','</h4>'); ?> <?php the_content(); ?> <p>Thanks: <?php comment_plugger(); ?></p> <p><?php wp_link_pages(); ?> <?php comments_popup_link(__('Comments (0)'), __('Comments (1)'), __('Comments (%)')); ?></p> <!-- <?php trackback_rdf(); ?> --> <?php include(ABSPATH . 'wp-comments.php'); ?> <br style="clear:both;" /> <?php endforeach; else: ?><br style="clear:both;" /> <p><?php _e('Sorry, no posts matched your criteria.'); ?></p> <?php endif; ?><br style="clear:both;" /> <div id="center"><div class="break"></div></div> </div> </div><br style="clear:both;" /></div> <div id="copyright"><?php include ("copyright.php"); ?></div></div> <br style="clear:both;" /> </body> </html> and my css is he http://invalidheart.org/wp-style/default/style.css any suggestions? I was wondering if someone could give me a hand on a CSS problem I am having. This is for my personal site that my wife and I use to update people on our lives. I have the page at a temporary location right now as I am moving the site between servers. Anyhow, I am working with WordPress and redoing the stylesheet. I am about half way done and am having a very strange problem. You can view the page here. The CSS is located below: Code: body,html { margin: 0; padding: 0; font: 10pt/15pt arial; background: #800000 url(images/topback.jpg) repeat-x top; text-align: center; } hr,h1,.description { display: none; } h2 { margin: 0; padding: 0; } #page { width: 843px; text-align: left; background: url(images/mainback.jpg) repeat-y; } #header { background: url(images/header.jpg) no-repeat; height: 275px; } #content { float: left; width: 300px; padding-left: 100px; } #sidebar { float: left; width: 200px; font-size: 8.5pt; } #sidebar li { list-style-type: none; } #footer { clear: both; } Here's the problem. In IE the width of the 'content' div is 509 pixels as can be seen by the red border (put in there to show the borders of the div). I am not defining the width to be 509 pixels, it is just defaulting to that width. You need to look at the page in IE...in Firefox it works fine. Someone just pointed this out on a site I'm working on. Any help would be appreciated. collettforcongress/com Works in Firefox (of course), doesn't work in IE8. Let the slider move one slide (the featured story box). Hey Guys, I hope this is in the right forum. I've purchased a wordpress theme and it contains a video background using JWPlayer. Part of the JWPlayer functionality is that it allows play/pause control when hovering over the video and a "hover hand" replaces the regular cursor. I'd like the cursor to stay the same at all times, and remove the ability to play/pause the video. So it's essentially just a regular looking background that's a video. I've done some searching online and it appears this is possible by placing a transparent div frame over the entire page with a cooresponding z index. Seems easy enough, but I'm not very familiar with CSS and the more I look online for the best way to go about this, the more confused and lost I'm getting. Can anybody shed some light on the best way to go about this? Certainly it must be quite straightforward? I have a pretty awesome looking wordpress theme. I was wondering if someone could guide me through making a small change to it though! Firstly, here is the page now: theangrywalrus.com/blog What I would like to do, is take the black bar at the top and stretch it so it goes under the title of my site, and ends near where the 'content' starts. Then I'd like to move the gradient bg image down so it starts under where the black bar ends. So far, using the firefox web dev plugin, I've only been able to get the black bar/gradient working in one part of the page, where the content is. How can I get it to be how I want it? Could someone show me how to get this done please? I'd really appreciate some help. My style sheet is he theangrywalrus.com/blog/wp-content/themes/simpla/style.css I'm new to wordpress and have coded with CSS before but this is doing my nut in! So any help would be very helpful I'm changing and existing template to suit a customer. I have 3 images as the header to the page on float left and the other right, the 3rd is in the center. In firefox and every other normal browser its displaying correctly, rounded corners etc. but in IE the main bit of the page is below the floated images and i cannot seem to make the clear:none hack in IE work. the site is occasionsbyjennifer .co .uk (wouldn't let me add a url) If you can have a look and suggest some ideas to try as i'm bleeding fed up with this. and because i haven't coded the full site etc i think i must be missing something obvious. thanks. Hello there, I'm looking for some assistance in coding the CSS for a plugin I installed called Participants Database. It's excatly what I need to record a survey for buyers. However I'm not very savvy in CSS, in fact I had someone else style my website. However I'm trying to add a page and make it look identical to one of my existing pages. This page has the correct style: monkeybreadbooks.com/contact/ This page is the new database page that is not styled: monkeybreadbooks.com/about/survey/ Basically I'm trying to mimic the appearance of the contact page to match the new survey page. Can someone help me out? Thanks Let me know if you need more information. I'm unsure of which .css files contain the code I need to edit, that's why I'm asking for help. I'm new to this site and I'm hope someone is kind enough to help with this CSS issue. I'm running a blog on the wordpress platform usig Coraline theme, I tweaked the CSS style sheet to add a background and opacity for the content container. The problem is with margins inside the content container, when I add padding larger than 0PX mybsidebars move to bottom of the site. I've tried a lot of changes but nothing seems to work. I've attached part of the content container code below and thanks in advance. container { clear: both; margin: 0 auto; opacity: 0.978; } #content-container { background:#E5E5E5; width: 100%; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } #main-sidebars { max-width: 450px; width: 45.5%; } #feature { width: 100%; float: left; } #primary, #secondary { overflow: visible; } #footer { clear: both; width: 100%; } Above is the code for the options I'm using for the site. The sites name is hhrapinfo dot com. I've checked the class, and it's peachy, I've added a style= "margin: 0 auto;" tag, a style="text-align: center;" tag. I've tried everything I can think of. The image isn't receiving any parent styling that is holding it back from centering that I am aware of. Will somebody please learn me! URL is : www . dalcon .com / business / skype-for-asterisk/ the image I'm referring to is the skype for asterisk image. Sorry about broken link, I don't have the rep around here to not be considered a spammer yet I guess (it won't let me post a link) I wish to use a wordpress header on vBulletin and for the most part it has worked. I have a couple issues though with staying logged in + the sub navigation bar. -Visually wise, it perfect on PC's....however it looks odd on my MAC. On MAC in "Safari" Code: http://i250.photobucket.com/albums/gg247/Rush23Hester/Screenshot2010-05-22at25823PM.png On MAC in "FireFox & Chrome : both looked like this" Code: http://i250.photobucket.com/albums/gg247/Rush23Hester/Screenshot2010-05-22at25823PM.png On PC's it "looks" perfect. As the sub navigation bar doesn't give a problem and it's lined up just fine. Any help? I am willing to pay to get this resolved. The style in question is Code: www.chicitysports.com/forum/?styleid=7 Sorry to ask but I cannnnnnot find this answer. I know it can be done too... Ok, I have a wordpress site and every time I add in custom CSS with a "background-image" TAG It works locally but not when I plug it to the live site. The graphics are a navigation bar thats it... here is the code Code: @charset "utf-8"; /* CSS Document */ a span { display: none; } #container #nav { background-image: url(../images/nav.png); height: 30px; width: 926px; margin-left: 100px; } #container #nav li { float: left; list-style-type: none; } a.main_nav { display: block; height: 30px; z-index: 1; } a.main_nav:hover { background-position: 0px -30px; } #nav_1 { background-image: url(DIRECT WEB LOCATION OF IMAGE); width: 133px; float: left; padding-left: 5px; background-repeat:no-repeat; } #nav_2 { background-image: url(DIRECT WEB LOCATION OF IMAGE); width: 182px; float: left; padding-left: 10px; background-repeat:no-repeat; } #nav_3 { background-image: url(DIRECT WEB LOCATION OF IMAGE); width: 160px; float: left; padding-left: 5px; background-repeat:no-repeat; } #nav_4 { background-image: url(DIRECT WEB LOCATION OF IMAGE); width: 148px; float: left; padding-left: 5px; background-repeat:no-repeat; } #nav_5 { background-image: url(DIRECT WEB LOCATION OF IMAGE); width: 115px; float: left; padding-left: 5px; background-repeat:no-repeat; } #nav_6 { background-image: url(DIRECT WEB LOCATION OF IMAGE); width: 122px; float: left; padding-left: 5px; background-repeat:no-repeat; } #nav_7 { background-image: url(DIRECT WEB LOCATION OF IMAGE); width: 122px; float: left; padding-left: 5px; background-repeat:no-repeat; } and my HTML Code: <div id="nav"> <a href="" class="main_nav" id="nav_1"><span>button</span></a> <a href="" class="main_nav" id="nav_2"><span>button</span> </a> <a href="" class="main_nav" id="nav_3"><span>button</span> </a> <a href="" class="main_nav" id="nav_4"><span>button</span> </a> <a href="" class="main_nav" id="nav_5"><span>button</span> </a> <a href="" class="main_nav" id="nav_6"><span>button</span> </a> <a href="" class="main_nav" id="nav_7"><span>button</span> </a> <div class="clear"></div> </div> if anyone can help me understand why this does not work in WP that would be most gracious of you -Jordan |