Adding and aligning image

  • Resolved Chuck Burke

    (@sizzlemonkey)


    11 years, 4 months ago

    Aloha Gang,
    I am trying to align an image in the header section of a zeetasty theme, in THIS site I have managed to get the image INTO the header, and aligned right, however as you can see the image is not centered in the logo div top to bottom.

    I have created a child theme and a basic style.css file as well as copied the header.php file to the child theme.

    What am I missing?

    ————style.css—————

    /*
    Theme Name: zeetasty child
    Theme URI: https://www.charleskburke.com/travelingchocolatecompany/zeetasty-child
    Description: NOTE: This is a child theme using zeetasty theme. WARNING:if you switch themes you may lose functionality.If you want to
    change the look, make a copy of this theme, rename it, and install it in WordPress-then start changing the design.
    Author: Sizzle Monkey
    Author URI: https://www.travelingchocolatecompany.com
    Template: zeetasty
    */

    @import url(“../zeetasty/style.css”);

    #logo
    {height:220px;
    max-width:100%;
    background-color:#f4d0af;
    /*<img src=”https://www.charleskburke.com/travelingchocolatecompany/wp-content/themes/zeetasty/images/travelingchocolatecompanytrucklogosmall.png”&gt;;*/

    }

    #truck
    {
    height:100px;
    padding-top:0px;
    padding-bottom:50px;
    float:right;
    background-color:blue;

    }

    img
    {
    margin-top:0px;
    padding-top:0px;
    }

    /*.header-image {
    height: 0px;
    max-width: 0px;
    vertical-align: top;
    width: 100%;
    }*/

    #wrap {
    background: none repeat scroll 0 0 #FDFDFD;
    border: 1.2em solid #f4d0af;
    box-shadow: 0 0 0 1px #CCCCCC inset;
    margin-top: 1px;
    padding: 1.5em;
    }

    ———header.php————

    <!DOCTYPE html><!– HTML 5 –>
    <html <?php language_attributes(); ?>>

    <head>
    <meta charset=”<?php bloginfo( ‘charset’ ); ?>” />
    <meta name=”viewport” content=”width=device-width, initial-scale=1″>
    <title><?php wp_title( ‘|’, true, ‘right’ ); ?></title>
    <link rel=”profile” href=”https://gmpg.org/xfn/11&#8243; />
    <link rel=”pingback” href=”<?php bloginfo( ‘pingback_url’ ); ?>” />

    <?php /* Embeds HTML5shiv to support HTML5 elements in older IE versions. */ ?>
    <!–[if lt IE 9]>
    <script src=”<?php echo get_template_directory_uri(); ?>/js/html5.js” type=”text/javascript”></script>
    <![endif]–>
    <?php wp_head(); ?>
    </head>

    <body <?php body_class(); ?>>

    <?php themezee_wrapper_before(); // hook before #wrapper ?>
    <div id=”wrapper” class=”hfeed”>

    <?php themezee_header_before(); // hook before #header ?>
    <header id=”header” class=”clearfix” role=”banner”>

    <div id=”logo”>

    <div id=”truck”>

    <img src=”https://www.charleskburke.com/travelingchocolatecompany/wp- content/themes/zeetasty/images/travelingchocolatecompanytrucklogosmall.png”>

    </div>
    ” title=”<?php echo esc_attr( get_bloginfo( ‘name’, ‘display’ ) ); ?>” rel=”home”>
    <?php // Display Logo Image or Site Title
    $options = get_option(‘zeetasty_options’);
    if ( isset($options[‘themeZee_general_logo’]) and $options[‘themeZee_general_logo’] <> “” ) : ?>
    <img class=”logo-image” src=”<?php echo esc_url($options[‘themeZee_general_logo’]); ?>” alt=”Logo” />
    <?php else: ?>
    <h1 class=”site-title”><?php bloginfo(‘name’); ?></h1>
    <?php endif; ?>

    <?php if(isset($options[‘themeZee_general_tagline’]) and $options[‘themeZee_general_tagline’] == ‘true’) : ?>
    <h2 class=”site-description””><?php echo bloginfo(‘description’); ?></h2>
    <?php endif; ?>

    </div>

    </header>
    <?php themezee_header_after(); // hook after #header ?>

    <nav id=”mainnav” class=”clearfix” role=”navigation”>
    <div id=”mainnav-border”></div>
    <?php
    // Get Navigation out of Theme Options
    wp_nav_menu(array(‘theme_location’ => ‘main_navi’, ‘container’ => false, ‘menu_id’ => ‘mainnav-menu’, ‘echo’ => true, ‘fallback_cb’ => ‘themezee_default_menu’, ‘before’ => ”, ‘after’ => ”, ‘link_before’ => ”, ‘link_after’ => ”, ‘depth’ => 0));
    ?>
    </nav>
    <div id=”mainnav-bg-wrap”><div id=”mainnav-bg”></div></div>

    <?php // Display Custom Header Image
    themezee_display_custom_header(); ?>

    Thank you in advance for your help. It is most appreciated.
    Chuck Burke

Viewing 7 replies - 1 through 7 (of 7 total)

  • Can’t you just change this 

    #truck
 {
 height:100px;
 padding-top:0px;
 padding-bottom:50px;
 float:right;
 background-color:blue;

}

    To

    #truck
 {
 height:100px;
 padding-top:0px;
 padding-bottom:50px;
 float:center;
 background-color:blue;

}

    All you need to change is
    float:right;
    to
    float:center;

    Thread Starter Chuck Burke

    (@sizzlemonkey)

    Thank you Websiteguy, but that moved the image left and caused the site tagline to move down ?? ….

    Thread Starter Chuck Burke

    (@sizzlemonkey)

    This turned out to be a padding issue in the logo div….now I need to adjust the margins for the site title and tag…. LOL…it never ends.
    Thank you for your help.

    I am most appreciative.

    Glad I could help.

    I don’t have an answer. I have a question.

    Our tagline in Zee Tasty moved itself down to the footer. We wanted it in the header. Have tried all the obvious things like looking at the header page.
    The theme says the tagline is at the top. But it’s not. We don’t know how or why it moved down to the footer.

    Any ideas how to get it back into the header?

    thanks

    kleverklikk please post your own support topic.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Adding and aligning image’ is closed to new replies.