I’ve customized my version of DepoMasthead with a few TypeKit changes and some custom CSS. Seems to be working smoothly on Firefox, Chrome and Safari, but on IE the boxes aren’t extending to full length, and the search button down the bottom isn’t centering.
Here’s my blog: https://darkmooninorbit.wordpress.com
Here’s the CSS:
[no need to post CSS – it’s all visible on your site and you also MUST use the code buttons when posting any code on these forums]
Any suggestions? I checked the DTD via a validator and no errors came up for *that* (others, yes, but they seem to be theme or WordPress default), so IE shouldn’t be kicking over into quirks mode.
]]>Here’s the site: www.micheldegroot.com/IndePhojo/
And here’s the code of the header.php:
s<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”https://www.w3.org/1999/xhtml” <?php language_attributes(); ?>>
<head profile=”https://gmpg.org/xfn/11″>
<meta http-equiv=”Content-Type” content=”<?php bloginfo(‘html_type’); ?>; charset=<?php bloginfo(‘charset’); ?>” />
<title><?php wp_title(); ?><?php bloginfo(‘name’); ?></title>
<link rel=”stylesheet” href=”<?php bloginfo(‘stylesheet_url’); ?>” type=”text/css” media=”screen” />
<!–[if gte IE 6]><link rel=”stylesheet” href=”<?php bloginfo(‘stylesheet_directory’); ?>/ie.css” type=”text/css” media=”screen” /><![endif]–>
<link rel=”alternate” type=”application/rss+xml” title=”<?php bloginfo(‘name’); ?> RSS Feed” href=”<?php bloginfo(‘rss2_url’); ?>” />
<link rel=”pingback” href=”<?php bloginfo(‘pingback_url’); ?>” />
<?php wp_enqueue_script(‘jquery’); ?>
<?php
if ( is_singular() ) wp_enqueue_script( ‘comment-reply’ );
wp_head();
?>
<script type=”text/javascript” charset=”utf-8″>
/*<![CDATA[ */
//set title font size
jQuery(document).ready(function() {
function resize(selector, max) {
jQuery(selector).each(function() {
var width = jQuery(this).width();
var height = jQuery(this).height();
if(width > max) {
var r = ( height / width );
var w = max;
var h = ( w * r );
jQuery(this).height(h).width(w);
}});
}
resize(‘#home .gallery img’, 90);
resize(‘#home .entry img’, 300);
resize(‘#home .wp-caption img’, 290);
resize(‘#home .wp-caption’, 300);
jQuery(‘#home .wp-caption’).css(‘height’, ‘auto’);
});
/* ]]> */
</script>
</head>
<body<?php if(is_front_page() or is_home()) { echo ‘ id=”home”‘; } ?>>
<div id=”page”>
<h1 class=”name”>/” title=”<?php bloginfo(‘description’); ?>”>
<span>
<?php $my_query = new WP_Query(‘showposts=1’);
while ($my_query->have_posts() && $count < 1) : $my_query->the_post();
$do_not_duplicate = $post->ID;?>
<?php $count++; $title = get_userdata($post->post_author); $title = $title->display_name; ?><?php endwhile; ?><?php echo (get_option(‘depo-author-name’)) ? get_option(‘depo-author-name’) : $title; ?></span></h1>
<div id=”container”>
<div class=”sleeve”>
<div id=”header”>
<?php
$title = strlen(get_bloginfo(‘name’));
if($title >= 30) $title = 40;
$new_size = (1000/$title)*2;
if($new_size > 120) $new_size = 120;
if(preg_match(‘/.*\s.*/’,$title) === false && ($title > 20)) $new_size = 72;
$size = $new_size;
?>
<h1 style=”font-size: 3em”>
<?php if(!is_front_page()) { ?>/” rel=”home”><img src=”https://www.phocazz.com/IndePhojo.png” border=”0″ alt=”logo”>
<?php } ?>
</h1>
<ul id=”menu”>
<?php
$pages = get_pages(‘sort_column=menu_order’);
foreach ($pages as $pagg) {
if ( $pagg->post_parent == 0 ) {
$option = ‘
‘;
echo $option;
}
}
?>
</div>
<div id=”content” class=”group”>
Thanks
]]>Here’s the site: www.micheldegroot.com/IndePhojo/
And here’s the code of the header.php:
s<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”https://www.w3.org/1999/xhtml” <?php language_attributes(); ?>>
<head profile=”https://gmpg.org/xfn/11″>
<meta http-equiv=”Content-Type” content=”<?php bloginfo(‘html_type’); ?>; charset=<?php bloginfo(‘charset’); ?>” />
<title><?php wp_title(); ?><?php bloginfo(‘name’); ?></title>
<link rel=”stylesheet” href=”<?php bloginfo(‘stylesheet_url’); ?>” type=”text/css” media=”screen” />
<!–[if gte IE 6]><link rel=”stylesheet” href=”<?php bloginfo(‘stylesheet_directory’); ?>/ie.css” type=”text/css” media=”screen” /><![endif]–>
<link rel=”alternate” type=”application/rss+xml” title=”<?php bloginfo(‘name’); ?> RSS Feed” href=”<?php bloginfo(‘rss2_url’); ?>” />
<link rel=”pingback” href=”<?php bloginfo(‘pingback_url’); ?>” />
<?php wp_enqueue_script(‘jquery’); ?>
<?php
if ( is_singular() ) wp_enqueue_script( ‘comment-reply’ );
wp_head();
?>
<script type=”text/javascript” charset=”utf-8″>
/*<![CDATA[ */
//set title font size
jQuery(document).ready(function() {
function resize(selector, max) {
jQuery(selector).each(function() {
var width = jQuery(this).width();
var height = jQuery(this).height();
if(width > max) {
var r = ( height / width );
var w = max;
var h = ( w * r );
jQuery(this).height(h).width(w);
}});
}
resize(‘#home .gallery img’, 90);
resize(‘#home .entry img’, 300);
resize(‘#home .wp-caption img’, 290);
resize(‘#home .wp-caption’, 300);
jQuery(‘#home .wp-caption’).css(‘height’, ‘auto’);
});
/* ]]> */
</script>
</head>
<body<?php if(is_front_page() or is_home()) { echo ‘ id=”home”‘; } ?>>
<div id=”page”>
<h1 class=”name”>/” title=”<?php bloginfo(‘description’); ?>”>
<span>
<?php $my_query = new WP_Query(‘showposts=1’);
while ($my_query->have_posts() && $count < 1) : $my_query->the_post();
$do_not_duplicate = $post->ID;?>
<?php $count++; $title = get_userdata($post->post_author); $title = $title->display_name; ?><?php endwhile; ?><?php echo (get_option(‘depo-author-name’)) ? get_option(‘depo-author-name’) : $title; ?></span></h1>
<div id=”container”>
<div class=”sleeve”>
<div id=”header”>
<?php
$title = strlen(get_bloginfo(‘name’));
if($title >= 30) $title = 40;
$new_size = (1000/$title)*2;
if($new_size > 120) $new_size = 120;
if(preg_match(‘/.*\s.*/’,$title) === false && ($title > 20)) $new_size = 72;
$size = $new_size;
?>
<h1 style=”font-size: 3em”>
<?php if(!is_front_page()) { ?>/” rel=”home”><img src=”https://www.phocazz.com/IndePhojo.png” border=”0″ alt=”logo”>
<?php } ?>
</h1>
<ul id=”menu”>
<?php
$pages = get_pages(‘sort_column=menu_order’);
foreach ($pages as $pagg) {
if ( $pagg->post_parent == 0 ) {
$option = ‘
‘;
echo $option;
}
}
?>
</div>
<div id=”content” class=”group”>
Thanks
]]>I know I can use an IE hack to correct the first alignment problem, but for the life of me, I can’t figure out why the second entries are offsetting again. Any help would be greatly appreciated.
]]>I’ve played with the CSS a little but things tend to get messy rather quickly, obviously due to my inexperience with coding.
I’d like to make the content column 960 px wide and then have the columns in the footer stretch so that (between them) they cover that width as well.
If anyone can offer any advice or a simple solution that would be fantastic.
Thanks.
]]>Fatal error: Call to undefined function: comment_class() in /home/*****/public_html/wp-content/themes/masthead/comments.php on line 61
]]>