Hi
I don’t know how is the structure of your html in the header.php file, but you can create three divs (one for the left image, one for the middle one, and other for the right image) and then change de css file to float every one where it should be.
For example:
<div id=”header-block”>
<div id=”left-img”></div>
<div id=”middle-img”></div>
<div id=”right-img”></div>
</div>
and in the css file something like that:
div#left-img{
background: transparent url(‘…’); //here de left img
float: left;
}
div#middle-img{
background: transparent url(‘…’); //here de middle img
float: left;
}
div#right-img{
background: transparent url(‘…’); //here de right img
float: right;
}
Make sure you set the width property for every div.
Thank you nerdanita,
i managed to create the nessesary div and the image apeared on my website. Unfortunetly I cant place it where its supposed to be.
There is some code about the sitename which has an image (for a logo) floating ontop of the header. Somehow this creates a huge problem to place the right-corner image.
where can i insert the code to have it right????
here is the portion in the header.php:
<body>
<div id=”container”>
<div id=”title-left”>
<div id=”title-wrapper”>
<div id=”sitename”>
<h1>“><?php bloginfo(‘name’); ?></h1>
<p><?php bloginfo(‘description’); ?></p>
</div>
</div>
</div>
<div id=”navmensearch”>
<div id=”navmensearch-wrapper”>
<div id=”navmenu”>
<li<?php echo (is_home() ? ‘ class=”current_page_item”‘: ”)?>>/”><span>Home</span>
<?php themefunction_list_pages_flat(‘title_li=’); ?>
</div>
<div id=”search”>
<form method=”get” id=”searchform” action=”<?php bloginfo(‘url’); ?>”>
<p><span class=”nodisplay”>Search </span><input type=”text” value=”Search” name=”s” id=”s” /></p>
</form>
</div>
</div>
</div>
this is the code in the layout-css:
div#title-left { margin: 0; padding: 0; width: 100%; height: 150px; border-bottom: 1px solid; }
div#title-wrapper { margin: 0 auto; padding: 0 0 0 0; width: 959px; height: 150px; }
div#sitename { margin: 0; padding: 0; float: left; width: 290px; height: 150px; }
div#sitename h1 { display: block; margin: 0; padding: 0; height: 150px; }
div#sitename h1 a, div#sitename h1 a:visited { display: block; margin: 0; padding: 0; height: 150px; text-indent: -9999px; }
div#sitename p { display: none; }
div#navmensearch { }
div#navmensearch-wrapper { margin: 0 auto; width: 905px; height: 44px; }
div#search { float: right; width: 270px; height: 44px; }
div#search form { width: 270px; height: 44px; }
div#search form p { display: block; margin: 0; padding: 15px 0 0 34px; }
div#search form p input { width: 226px; border: 0; }
where should I implement the <div id=”title-right”></div> in the header.php
where should I implement the div#title-left { margin: 0; padding: 0; width: 100%; height: 150px; border-bottom: 1px solid; } …is this code ok does it need some change?
thank you for your help
Well, now I can’t see where do you want to set the images.
Try this in a new html file to see if it’s what you need.
<style type="text/css">
div#header-container{width: 959px;}
div#title-left { background-color: red;margin: 0; padding: 0; width: 100px; height: 150px; border-bottom: 1px solid; float:left;}
div#title-right{ background-color: blue;margin: 0; padding: 0; width: 100px; height: 150px; border-bottom: 1px solid; float:right}
div#title-middle { background-color: green;margin: 0 auto; padding: 0 0 0 0; width: 759px; height: 150px; float:left;}
div#sitename { margin: 0; padding: 0; float: left; width: 290px; height: 150px; }
div#sitename h1 { display: block; margin: 0; padding: 0; height: 150px; }
div#sitename h1 a, div#sitename h1 a:visited { display: block; margin: 0; padding: 0; height: 150px; text-indent: -9999px; }
div#sitename p { display: none; }
div#navmensearch { }
div#navmensearch-wrapper { margin: 0 auto; width: 905px; height: 44px; }
div#search { float: right; width: 270px; height: 44px; }
div#search form { width: 270px; height: 44px; }
div#search form p { display: block; margin: 0; padding: 15px 0 0 34px; }
div#search form p input { width: 226px; border: 0; }
</style>
<div id="header-container">
<div id="title-left"></div>
<div id="title-middle">
<div id="title-wrapper">
<div id="sitename">
<h1>NOMBRE</h1>
<p>DESCRIPCION</p>
</div>
</div>
</div>
<div id="title-right"></div>
</div>
If it’s what you need, you can set the background images and change the width of every block to make it looks like you want.
Let me know if it works!
(Sorry about my english… :$)
Stil does not work 🙁
im going nuts! What is wrong with this template!!!!!!
Hey is it possible if I send you my Theme folder with the nessesary Images that have to be implantet and you take a look at my code yourself???
This would be so great!!!! what do you think nerdanita?
Send me your code and the images to analia (at) eraxia (dot) com
and if a I have some free time this weekend I’ll check it out.
Have a nice weekend =)