Author Topic: Problem with vertical align (Read 7285 times)

yiannisK · « **on:** May 19, 2008, 00:28:06 »

Dear friends,

i am really happy working on my 1st project

using Elxis

http://bodet.gr/

Everything works fine except the header. In that position i use:
1. Flash, file "main.swf", dim. 345px X 209px
2. Image, file "head.jpg", dim. 610px X 209px
3. Image, file "searchbox.png", dim. 438px X 209px

The image between the swf. and the right column can't be vertically aligned in IE. If i change the parameters of the layout.css i can fix the IE, but then the problem is on the Mozilla. Here is my code:

LAYOUT.CSS

Code: [Select]

#head2 {
	background:url(../images/head.jpg) bottom no-repeat;
	width: 610px;
	height: 209px;
	margin-left: 345px;
	margin-top: -213px;

}

#header-container {
	background: url(../images/header_bg2.png);
}
/* template's header */

#header {
	position: relative;
	height: 233px;
}

	
	
#header h1
{
	font-family: Arial, Helvetica, sans-serif;	
	position: absolute;
	top: 1.5em;
	font-size: 3em;
	line-height:1em;
	color: #fff;
	font-weight: bold;
	padding-left: 20px;
	margin: 0;
	width: 50%;
}

#header h1 a
{
	color: #fff;
	text-decoration: none;
}

#header h2
{
	position: absolute;
	font-size: 1em;
	top: 7em;
	color: #FEF4D3;
	padding-left: 23px;
	font-family: "Trebuchet MS", tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;
	}

/* div for language module positioned top right */
#headright {
/*	float: right;
	width: 40%;
	height: 110px;    */
	float:right;
	margin-top:-200px;
	margin-right: 30px;
	width: 80px; 
}

#flags {
	float:right;
	z-index:1;
	position: relative;
	top: 10px;
}

INDEX.PHP

Code: [Select]

<body>
<div id="container">
	<div id="mainwrap">
		<div id="header-container">
		<div id="header">
		<object classid="clsid:D27CDB6E-AE6D-11CF-96B8-444553540000" id="obj1" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" style="width: 345px; height: 209px">
       <param name="movie" value="<?php echo $mosConfig_live_site; ?>/templates/promoweb/images/main.swf"/>
       <param name="quality" value="Best"/>
       <param name="menu" value="false"/>
       <embed src="<?php echo $mosConfig_live_site; ?>/templates/promoweb/images/main.swf" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" name="obj1" quality="Best" menu="false" style="width: 345px; height: 209px"/>
</object>
        
	    <div id="head2"></div>
        <div id="headright">

The second question is about the non re-loading of the header files. When i change page it seems that the cache of the pc don't provide these files and makes that ugly flash effect. Is there any parameter that i can use so the images remains in the cache?

Any suggestion?!

Thanks in advanced for your replies,
Yiannis

[old attachment deleted by admin]

Ivan Trebješanin · « **Reply #1 on:** May 19, 2008, 00:44:04 »

Everything looks OK to me in header section...

yiannisK · « **Reply #2 on:** May 19, 2008, 01:01:39 »

Dear Ivan,

thanks for the immediate response

If you see carefully on the middle of the header, on IE (not on mozilla!!) the image with the people, remains 3 px higher from the other...

Ivan Trebješanin · « **Reply #3 on:** May 19, 2008, 04:01:47 »

Quote from: yiannisK on May 19, 2008, 01:01:39

Dear Ivan,

thanks for the immediate response

If you see carefully on the middle of the header, on IE (not on mozilla!!) the image with the people, remains 3 px higher from the other...

You can always use conditional style if IE 6, if IE 7, or simply if IE... like this:

yiannisK · « **Reply #4 on:** May 19, 2008, 10:31:28 »

Fixed!

Thanks Ivan

Author Topic: Problem with vertical align (Read 7285 times)

yiannisK

Problem with vertical align

Ivan Trebješanin

Re: Problem with vertical align

yiannisK

Re: Problem with vertical align

Ivan Trebješanin

Re: Problem with vertical align

yiannisK

Re: Problem with vertical align