Header foreground image not appearing


Author Message
mikew5163

Posted: 4/3/2012
Quote message 

I have exported a project as a website and used it in a MojoPortal skin. This is my first attempt at doing this in Artisteer 3.0 - I have done many in v2.4 without hitting this particular problem.

My problem is that the header foreground image is not displaying in my mooportal skin. I notice Artisteer now creates header.jpg (which is the header background) and header-object.png (which is the foreground). Both these are created ok and are referenced in style.css, but the foreground png is just not rendered. All I get is the background.

Any ideas?
 
Garry

Posted: 4/4/2012
Quote message 

Can help you better on having your website URL.
 
Sjors

Posted: 7/13/2012
Quote message 

I seem to run into the same problem mikew5163 describes. Created a menu header that contains both a foreground- and backgroundphoto, resulting in this snippet css:

/* begin Header */
div.art-header
{
margin: 0 auto;
position: relative;
width:100%;
height: 150px;
margin-top: 0;
margin-bottom: 0;
}

div.art-header-clip
{
position: absolute;
width:100%;
left:0;
overflow:hidden;
height:150px;
}

div.art-header-center
{
position: relative;
width: 792px;
left:50%;
}

div.art-header-png
{
position: absolute;
left:-50%;
top: 0;
width: 792px;
height: 150px;
background-image: url('images/header.png');
background-repeat: no-repeat;
background-position:center center;
}

/* end Header */

/* begin HeaderObject */
div.art-headerobject
{
display: block;
left: 0;
margin-left: -101px;
position: absolute;
top: 0;
width: 355px;
height: 150px;
background-image: url('images/header-object.png');
}
/* end HeaderObject */

Then I export as html, and copy the css to Mojo. Everything works fine, except for the foreground-photo (header-oobject.png).

The html of Mojo:

<div class="art-header">
<div class="art-header-center">
<div class="art-header-png"></div>
<div class="art-header-jpeg"></div>
</div>
<div id="art-flash-area"> blablabla </div>
<div class="art-logo">
<portal:SkipLink ID="SkipLink1" runat="server" />
<portal:SiteTitle ID="SiteTitle" runat="server"></portal:SiteTitle>
<h2 id="slogan-text" class="art-logo-text">
<portal:SiteSlogan id="ss1" runat="server" /></h2>
</div>
</div>

If I add the line <div class="art-headerobject"></div> to the 'art-header-center, my foreground photo pops up. How can I align this to the left and give it a white background (as it has in my artisteer design)?

tia

Sjors