Marty
|
I wanted two different headers. So, I made a "Pages" template then a second header.php.
Here's a description of what i did.
On the index.php I used a picture under my menu. In order to get that to work I simply moved my .art-contentLayout (CSS) down 150 px. All went well. It looks great. On the rest of the pages I wanted a smaller pic (narrower) below the menu. I then copied my .art-contentLayout css and made a .art-contentLayout2 css. I placed the .art-contentLayout2 in the second header along with the proper header.php coding. The smaller picture required less margin then on the index.php. Around 75px. The new margin is causing my sidebar to drop under the content. Not sure why this would happen. Seems to me is that the .art-contentLayout is basically the same for both headers. Why would this happen.
Here's my home page: http://stephenmartindesigns.com/ksaseysite2/
Here's my "Pages" template:. http://stephenmartindesigns.com/ksaseysite2/?page_id=30
Anyone got any ideas as to why this is happening? I've been working with it for hours and cannot get it.
Thanks
|
| |
BrianD
|
I don't have a solution, but I have seen something similar on two different sites... the sidebar will drop down under the page content. One site had a single sidebar, and had been running fine for quite a while. The other site was in development and has twin sidebars (only one was misbehaving). I'm using Artisteer version 2.2.0.17981. On the one with twin sidebars I fixed it by swapping widgets between the two sidebars - no idea what's going on with the other site. Would love to hear of a solution though.
|
| |
Marty
|
Thanks, Brian. I hope someone can help me with this. I spend a lot of time today learning how to use two headers, it would be nice to work this glitch out.
Peace...
|
| |
Garry
|
I am not sure I understand you fully but I think you wanna move your sidebar to your right on following page: http://stephenmartindesigns.com/ksaseysite2/?page_id=30
If it is you need to replace "float: left" to "float:right" like following
.art-contentLayout2 .art-sidebar1
{
border:0 none;
float:left;
margin:0 0 0;
overflow:hidden;
padding:0;
position:relative;
width:180px;
}
---------------------
To:
---------------------
.art-contentLayout2 .art-sidebar1 {
border:0 none;
float:right;
margin:0 0 0;
overflow:hidden;
padding:0;
position:relative;
width:180px;
}
|
| |
Marty
|
Thanks for responding, Garry. As always...you're the best.
Unfortunately, you're suggestion didn't work. I don't think I was clear enough.
I'm working with two different pages and one css sheet. The index page has the header and a pic just below the menu. Here: http://stephenmartindesigns.com/ksaseysite2/. The other page has the same header but a different pic. See here: http://stephenmartindesigns.com/ksaseysite2/?page_id=30.
As you can see, the sidebar on the second page has moved down. I dont' know why.
Here's my header2.php code
<!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" <?php language_attributes(); ?>>
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<title><?php if (is_home () ) { bloginfo('name'); } elseif ( is_category() ) { single_cat_title(); echo ' - ' ; bloginfo('name'); }
elseif (is_single() ) { single_post_title(); }
elseif (is_page() ) { bloginfo('name'); echo ': '; single_post_title(); }
else { wp_title('',true); } ?></title>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/script.js"></script>
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
<!--[if IE 6]><link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/style.ie6.css" type="text/css" media="screen" /><![endif]-->
<!--[if IE 7]><link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/style.ie7.css" type="text/css" media="screen" /><![endif]-->
<link rel="alternate" type="application/rss+xml" title="<?php printf(__('%s RSS Feed', 'kubrick'), get_bloginfo('name')); ?>" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="alternate" type="application/atom+xml" title="<?php printf(__('%s Atom Feed', 'kubrick'), get_bloginfo('name')); ?>" href="<?php bloginfo('atom_url'); ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php wp_head(); ?>
</head>
<body>
<div id="art-main">
<div class="art-Sheet">
<div class="art-Sheet-tl"></div>
<div class="art-Sheet-tr"></div>
<div class="art-Sheet-bl"></div>
<div class="art-Sheet-br"></div>
<div class="art-Sheet-tc"></div>
<div class="art-Sheet-bc"></div>
<div class="art-Sheet-cl"></div>
<div class="art-Sheet-cr"></div>
<div class="art-Sheet-cc"></div>
<div class="art-Sheet-body2">
<div class="art-Header">
<div class="art-Header-jpeg"></div>
<div class="art-Logo">
<h1 id="name-text" class="art-Logo-name">
<a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a></h1>
<div id="slogan-text" class="art-Logo-text">
<?php bloginfo('description'); ?></div>
</div>
</div>
<div class="art-nav">
<div class="l"></div>
<div class="r"></div>
<div class="art-nav-center">
<ul class="art-menu">
<?php art_menu_items(); ?>
</ul>
</div>
</div>
End header2.php code
.
Below is the css code for the header2.php
.art-Sheet-body2
{
position: relative;
background-image: url(images/topnavinside.png);
z-index: 1;
padding: 18px;
background-repeat: no-repeat;
background-position: center 90px;
}
.art-contentLayout2
{
position: relative;
margin-bottom: 3px;
width: 724px;
margin-top: 70px;
}
.art-contentLayout2 .art-sidebar1
{
position: relative;
padding: 0;
border: 0;
float: right;
overflow: hidden;
width: 180px;
margin-top: 0px;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
}
End css code for header2.php
Below is the css code for the default header.php
art-Sheet-body
{
position: relative;
background-image: url(images/topnavpic3.jpg);
z-index: 1;
padding: 18px;
background-repeat: no-repeat;
background-position: center 90px;
}
.art-contentLayout
{
position: relative;
margin-bottom: 3px;
width: 724px;
margin-top: 150px;
}
.art-contentLayout .art-sidebar1
{
position: relative;
padding: 0;
border: 0;
float: left;
overflow: hidden;
width: 180px;
margin-top: 33px;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
}
Can you help me out?
|
| |
Marty
|
Nevermind, Garry. I got it. In addition to the above css duplication, I needed to duplicate these.
.art-contentLayout .art-content
{
position: relative;
margin: 0;
padding: 0;
border: 0;
float: left;
overflow: hidden;
width: 542px;
}
.art-contentLayout2 .art-content2
{
position: relative;
margin: 0;
padding: 0;
border: 0;
float: left;
overflow: hidden;
width: 541px;
}
For some unknown reason the width needed to be altered by one pixel. That allowed the sidebar to move up. Coding...go figure.
Thanks again for your time and effort. You are greatly appreciated!
|
| |
Garry
|
Yes, your ".art-Post "
width is more and following div it is not aligned left:
.art-Post
{
margin:10px;
}
-------------------
It should be:
-------------------
.art-Post
{
float:left;
margin:10px;
width:500px;
}
|
| |