1 reply [Last post]
sharks3010
Offline
newbie
Liverpool
Last seen: 4 years 45 weeks ago
Liverpool
Timezone: GMT+1
Joined: 2009-10-19
Posts: 1
Points: 2

Hello,

This is my first post so if things aren't in the right place then please accept my apologies. I'm having an issue with a simple theme for wordpress. It is a simple two column layout with sidebar on the left containing main nav and content box on the right containing sub nav and page/post content.

The issue is the way the horizontal subnav display in conjunction with post/page H2. The heading shifts position to the end of the last LI in the UL, after the UL goes onto two lines or more. However this only seems to happen in firefox/safari. Also in IE, if the LI on the end of the line has multiple words and spaces, it shifts those words below one another and displays incorrectly.

Here is my CSS code:

body {
text-align: left;
font: 75%/150% "Trebuchet MS", Tahoma, Arial;
color: #333333;
margin: 0px;
padding: 0px 0px 40px;
}

#wrapper {
display: block;
width:965px;
margin:0px auto;
background: #FFFFFF url(images/mainbg.jpg) repeat;
}

#header {
background: #0FACEA url(images/header.jpg) no-repeat;
height: 217px;
border-bottom: 0px solid #59780a;
position: relative;
}

#sidebar {
width: 186px;
float: left;
text-align: left;
background: #FFFFFF url(images/sidebarbg.jpg) repeat;

}

#main {
background:#FFFF00;

}

#sidebar ul{
list-style-type:none;
margin:0;
padding:0;
color:#FFFFFF;

}

#sidebar ul ul{

padding-left:10px;

}

#sidebar ul li.page_item{
display:block;
margin:0;
padding:0px 0px 10px 25px;
background: transparent url(images/bullet.jpg) no-repeat scroll 0px 0px;
font-family:"Century Gothic";
font-size:18px;
font-weight:bold;

}

#sidebar ul li ul li.page_item{
display:block;
margin:0;
padding:0px 0px 5px 0px;
font-family:"Century Gothic";
font-size:18px;
font-weight:bold;

}

#sidebar a {
text-decoration: none;
color:#FFFFFF;

}

#sidebar a:hover {
text-decoration: none;
color:#000000;

}

#content {
width: 778px;
float: right;
text-align: left;
padding-right:60px;
background: #FFFFFF url(images/contentbg.jpg) repeat;
padding:0px 20px 0px 20px;
}html>body #content {
width: 758px;
float:right;
text-align: left;
padding-left:10px;
padding-right:10px;

}

#content a:hover {
text-decoration: none;
color:#000000;

}

#content a {

text-decoration: none;
color:#006699;
}

#both {
clear: both;
}

#footer {
background: #FFFFFF url(images/footerbg.jpg) no-repeat;
}

#footer ul{
list-style-type:none;
margin:0;
padding:0;
}

#footer ul li{
padding-left: 30px;
background: transparent url(images/mini-page-arrow.gif) no-repeat scroll 0px 6px;
}

#footer a{

color:#006699;
text-decoration:underline;

}

#footer a:hover{

color:black;

}

#footer .left-col{
width: 300px;
float: left;
margin-left: 10px;
height: 133px;
text-align:left;
padding-left: 21px;
padding-top: 10px;

}

#footer .middle-col{
width: 300px;
float: left;
margin-left: 10px;
height: 200px;
text-align:left;
padding-left: 21px;
padding-top: 10px;
color:#FFFFFF;
}

#footer .right-col{
width: 300px;
float: left;
margin-left: 10px;
height: 200px;
text-align:left;
padding-left: 21px;
padding-top: 10px;
}
.title {
font-size: 11pt;
font-family: verdana;
font-weight: bold;
}

img {
border:0;
}

img.centered, .aligncenter, div.aligncenter {
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;
}

ul#nav {
height:25px;
border:0px solid #ccc;
background:#fff;
margin:1em 0;
padding:0;
}

ul#nav li {
list-style:none;
float:left;
border-right:1px solid #ccc;
line-height:25px;
padding:0 10px;
font-weight:bold;
font-size:14px;
}

And here is the HTML/PHP code for the wordpress theme.

 get_header();

 if(have_posts()) :  while(have_posts()) : the_post();

 the_ID(); ">

 the_title();

 the_content();

 endwhile;

 posts_nav_link();

 endif;

 get_sidebar();

 get_footer();

Hope this is enough, any help would be greatly appreciated. I've taken this theme over from someone else and it seems that they have done a few strange things with it.

Anyway thanks again and lookin forward to the feedback

Cheers

Dave

Verschwindende
Verschwindende's picture
Offline
Guru
Last seen: 1 week 4 days ago
Timezone: GMT-4
Joined: 2009-10-09
Posts: 2037
Points: 2256

Could you possibly run the

Could you possibly run the page and show the source code of the final markup? PHP doesn't really help.

I consider this a Triumph.