1 reply [Last post]
kiwis
kiwis's picture
Offline
Enthusiast
Last seen: 5 weeks 6 days ago
Timezone: GMT+12
Joined: 2009-03-07
Posts: 66
Points: 104

THis is my code, the news-close class is the placement of my close button. The border of my newswindow goes over top of this though?

how can I change this

#NewsWindow{
	z-index: 99;
	width:50%;
	position:absolute;
	left:25%;
	border-radius: 6px;
	border: solid 4px  #181818;
	background-color:#FFFFFF;
	display:none;
	margin: 0 auto;	
	margin-top: 100px;
	padding: 5px;
}
 
.news-close{
	cursor:pointer;
	float:right;
	right: -17px;
	top:-17px;
	position:absolute;
	z-index:1000;
}

echo "<img src=\"img/close-icon.png\" class=\"news-close\" onclick=\"ShowNews($ID)\">";
?>
 
<iframe seamless width="100%" height="600" src="<?php echo $Link; ?>"></iframe>

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 22 hours 25 min ago
Dallas
Timezone: GMT-5
Joined: 2004-06-25
Posts: 9761
Points: 3843

Absolute positioning and gotchas

You don't really provide enough info to debug this issue.

Please show us the html markupfor the elements in question and their parents (not the php scripting). A link would be preferable.

Note: Absolute positioned elements are not in the flow, and are invisible to other elements, so they can't get out of each other's way.

Another note: Float and absolute position are mutually exclusive.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.