-
Possible to hide part of a Div?
Hello,
I have a .swf in a Div and I need to hide about 100 pixels on the left hand side.
Is this possible?
Thanks.
-
Hi there davidwhite,
The following example works in all browsers, except Safari, for which I was unable to find a solution.
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="language" content="english">
<meta http-equiv="Content-Style-Type" content="text/css">
<title></title>
<style type="text/css">
#swf-holder {
width:200px;
border:1px solid #000;
margin:auto;
overflow:hidden;
}
#swf-holder object {
display:block;
width:300px;
height:200px;
border:0;
margin-left:-100px;
}
</style>
</head>
<body>
<div id="swf-holder">
<object type="application/x-shockwave-flash" data="http://www.coothead.co.uk/images/smiles.swf">
<param name="movie" value="http://www.coothead.co.uk/images/smiles.swf">
</object>
</div>
</body>
</html>
coothead
-
 Originally Posted by coothead
Hi there davidwhite,
The following example works in all browsers, except Safari, for which I was unable to find a solution.
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="language" content="english">
<meta http-equiv="Content-Style-Type" content="text/css">
<title></title>
<style type="text/css">
#swf-holder {
width:200px;
border:1px solid #000;
margin:auto;
overflow:hidden;
}
#swf-holder object {
display:block;
width:300px;
height:200px;
border:0;
margin-left:-100px;
}
</style>
</head>
<body>
<div id="swf-holder">
<object type="application/x-shockwave-flash" data="http://www.coothead.co.uk/images/smiles.swf">
<param name="movie" value="http://www.coothead.co.uk/images/smiles.swf">
</object>
</div>
</body>
</html>
coothead
Thanks but it doesn't seem to work in Firefox or Chrome either - just in IE.
Last edited by davidwhite; 01-14-2013 at 07:41 AM.
-
Hi there davidwhite,
The code that I supplied was tested successfully in the following browsers...
- IE9
- Firefox 18.0
- Opera 12.12
- Chrome 24.0.1312.52
Safari 5.1.7 would not render "overflow:hidden". 
coothead
-
Using position:absolute; in the CSS allows you to overlap divs with z-index settings.
Thread Information
Users Browsing this Thread
There are currently 1 users browsing this thread. (0 members and 1 guests)
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
Forum Rules
|
|
Bookmarks