Re: [css-d] Horizontal scrolling in iframe
| URL: http://www.studentremix.org/test/ms/media.htm | CSS: http://www.studentremix.org/test/ms/ms.css | | | Perhaps something like this: | http://www.cssplay.co.uk/menu/photo_strip | | Cheers, | Gary Thanks so much, that works perfectly in all browsers tested except for IE7. It scrolls vertically now. I don't see what the difference between their code and mine is that would be causing the problem. Any ideas? Thanks, Daniel __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Horizontal scrolling in iframe
Daniel Hammond wrote:
| You can use overflow-x and overflow-y properties separately,
| instead of just overflow: scroll
|
| http://www.w3.org/TR/css3-box/#overflow
|
| It's been supported since Mozilla 1.8 and IE5. I think all
| browsers support it even though it wasn't part of CSS2.1
| specs (it will likely be in CSS3).
|
| Sounds like a topic for a blog post ;-)
|
| -Estelle
Very good. I used overflow-x: scroll and it fixed the problem. Thanks very
much for your help. Now about what you mentioned regarding the potential
situation where I may not know the required width... Do you know of
something that would work if that were the case?
Thanks again,
Daniel
Re: http://www.studentremix.org/test/ms/media.htm
For CSS this can only be done with media queries [1] [2].
@media all and (min-width:800px) {
iframe {overflow-x:hidden;overflow-y:hidden;}
}
This will only work in Safari and Opera.
1. http://www.w3.org/TR/css3-mediaqueries/
2. http://css-class.com/test/css/selectors/media/min-width1.htm
--
Alan http://css-class.com/
Nearly all men can stand adversity, but if you want to test a man's
character, give him power - Abraham Lincoln
Save the Internet - http://www.savetheinternet.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Horizontal scrolling in iframe
| Daniel Hammond wrote:
| | You can use overflow-x and overflow-y properties separately,
| | instead of just overflow: scroll
| |
| | http://www.w3.org/TR/css3-box/#overflow
| |
| | It's been supported since Mozilla 1.8 and IE5. I think all
| | browsers support it even though it wasn't part of CSS2.1
| | specs (it will likely be in CSS3).
| |
| | Sounds like a topic for a blog post ;-)
| |
| | -Estelle
|
|
| Very good. I used overflow-x: scroll and it fixed the
| problem. Thanks very
| much for your help. Now about what you mentioned regarding
| the potential
| situation where I may not know the required width... Do you know of
| something that would work if that were the case?
|
| Thanks again,
| Daniel
|
| Re: http://www.studentremix.org/test/ms/media.htm
| For CSS this can only be done with media queries [1] [2].
|
| @media all and (min-width:800px) {
|iframe {overflow-x:hidden;overflow-y:hidden;}
| }
|
| This will only work in Safari and Opera.
|
| 1. http://www.w3.org/TR/css3-mediaqueries/
| 2. http://css-class.com/test/css/selectors/media/min-width1.htm
|
| Alan http://css-class.com/
Are you sure? This site: http://www.cssplay.co.uk/menu/photo_strip shows
exactly what I'm trying to do, and it's working beautifully in all the
browsers I've tested it in. I'm just trying to figure out why theirs works
in IE7 and mine doesn't. I don't see them using any media queries. Am I
missing something?
Thanks,
Daniel
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Horizontal scrolling in iframe
| Is there a way to get rid of the faded out vertical scroll bar | that is not being used? | | | I assume you're seeing that in iExploder, right ? | overflow-x:hidden or overflow-y:hidden will hide the scrollbar you | don't want. | | Philippe Actually, I was seeing it in all browsers tested (FF3, Safari, Opera, and IE 6 7). The problem is solved now, though. Thanks, Daniel __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Horizontal scrolling in iframe
| You can use overflow-x and overflow-y properties separately, | instead of just overflow: scroll | | http://www.w3.org/TR/css3-box/#overflow | | It's been supported since Mozilla 1.8 and IE5. I think all | browsers support it even though it wasn't part of CSS2.1 | specs (it will likely be in CSS3). | | Sounds like a topic for a blog post ;-) | | -Estelle Very good. I used overflow-x: scroll and it fixed the problem. Thanks very much for your help. Now about what you mentioned regarding the potential situation where I may not know the required width... Do you know of something that would work if that were the case? Thanks again, Daniel __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Horizontal scrolling in iframe
Perhaps something like this: http://www.cssplay.co.uk/menu/photo_strip Cheers, Gary URL: http://www.studentremix.org/test/ms/media.htm CSS: http://www.studentremix.org/test/ms/ms.css In the iframe, I want the photo thumbnails to scroll horizontally, not vertically as they do now. I want them to be in one row, only one thumbnail tall, if that makes sense. I wrapped them in a div (which has the royal blue background color for the sake of easy visibility/identification) and gave it a specific pixel-based height, but it still automatically expands vertically to hold the content instead of horizontally. I achieved this desired effect in the past, but I believe I did it with a table. I'd rather stick to pure CSS this time. Any ideas? Thanks, Daniel __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Horizontal scrolling in iframe
URL: http://www.studentremix.org/test/ms/media.htm CSS: http://www.studentremix.org/test/ms/ms.css In the iframe, I want the photo thumbnails to scroll horizontally, not vertically as they do now. I want them to be in one row, only one thumbnail tall, if that makes sense. I wrapped them in a div (which has the royal blue background color for the sake of easy visibility/identification) and gave it a specific pixel-based height, but it still automatically expands vertically to hold the content instead of horizontally. I achieved this desired effect in the past, but I believe I did it with a table. I'd rather stick to pure CSS this time. Any ideas? Thanks, Daniel __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Horizontal scrolling in iframe
#iframePhotos {
margin: 0 0 15px 25px;
text-align: center;
display: inline:
}
Worked for me...
*** REPLY SEPARATOR ***
On 25/08/2008 at 5:15 p.m. Daniel Hammond wrote:
in the past, but I believe I did it with a table. I'd rather stick to pure
CSS this time. Any ideas?
---
Karl
Teknofile Services
www.teknofile.co.nz
Please consider the environment before printing this email.
This message was scanned by AVG v8. No virus data was found in this outgoing
message.
Checked by AVG - http://www.avg.com
Version: 8.0.138 / Virus Database: 270.6.7/1631 - Release Date: 8/24/2008 12:15
PM
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Horizontal scrolling in iframe
| | URL: http://www.studentremix.org/test/ms/media.htm
| | CSS: http://www.studentremix.org/test/ms/ms.css
| |
| | In the iframe, I want the photo thumbnails to scroll horizontally, not
| | vertically as they do now. I want them to be in one row, only one
thumbnail
| | tall, if that makes sense. I wrapped them in a div (which has the royal
blue
| | background color for the sake of easy visibility/identification) and
gave it
| | a specific pixel-based height, but it still automatically expands
vertically
| | to hold the content instead of horizontally. I achieved this desired
effect
| | in the past, but I believe I did it with a table. I'd rather stick to
pure
| | CSS this time. Any ideas?
| |
| | Thanks,
| | Daniel
| |
|
| #iframePhotos {
| margin: 0 0 15px 25px;
| text-align: center;
| display: inline:
| }
|
| Worked for me...
| Karl
Really? That didn't do anything for me. Especially since I would think
something needs to be done with the photoThumbMainWrapper selector, not
the iframePhotos one. If you have a URL that you could provide that shows
it working how it should, that would be helpful. Thanks for the effort.
Daniel
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Horizontal scrolling in iframe
No URL, just local file... But it wasn't actually a fix, sorry. Was caused by the page spreading across dual monitor desktop. My bad, ignore me. Nice site though, like the nav... *** REPLY SEPARATOR *** On 25/08/2008 at 7:22 p.m. Daniel Hammond wrote: Really? That didn't do anything for me. Especially since I would think something needs to be done with the photoThumbMainWrapper selector, not the iframePhotos one. If you have a URL that you could provide that shows it working how it should, that would be helpful. Thanks for the effort. --- Karl Teknofile Services www.teknofile.co.nz Please consider the environment before printing this email. This message was scanned by AVG v8. No virus data was found in this outgoing message. Checked by AVG - http://www.avg.com Version: 8.0.138 / Virus Database: 270.6.7/1631 - Release Date: 8/24/2008 12:15 PM __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Horizontal scrolling in iframe
| If you give the parent container a width to contain the
| horizontal elements, the iFrame will get a horizontal scroll bar.
|
| .photoThumbMainWrapper {width: 1685px;}
|
| That works if you know the number of thumbnails. Are you
| going to know the width? If not, let me know, and i'll help
| you further.
|
| -Estelle
|
| URL: http://www.studentremix.org/test/ms/media.htm
| CSS: http://www.studentremix.org/test/ms/ms.css
|
Thanks, that does help. However, I've now decided to use a div with
overflow:scroll to give the appearance of an iframe without actually using
an iframe. Is there a way to get rid of the faded out vertical scroll bar
that is not being used? Also, I am interested in hearing your suggestion for
if I do not know the number of thumbnails or width that the div needs to be.
Thanks for your help,
Daniel
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Horizontal scrolling in iframe
On Aug 26, 2008, at 10:08 AM, Daniel Hammond wrote: Is there a way to get rid of the faded out vertical scroll bar that is not being used? I assume you're seeing that in iExploder, right ? overflow-x:hidden or overflow-y:hidden will hide the scrollbar you don't want. Philippe --- Philippe Wittenbergh http://l-c-n.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Horizontal scrolling in iframe
You can use overflow-x and overflow-y properties separately, instead of just
overflow: scroll
http://www.w3.org/TR/css3-box/#overflow
It's been supported since Mozilla 1.8 and IE5. I think all browsers support it
even though it wasn't part of CSS2.1 specs (it will likely be in CSS3).
Sounds like a topic for a blog post ;-)
-Estelle
CSS, JavaScript and XHTML Explained
http://evotech.net/blog
--- On Mon, 8/25/08, Daniel Hammond [EMAIL PROTECTED] wrote:
From: Daniel Hammond [EMAIL PROTECTED]
Subject: RE: [css-d] Horizontal scrolling in iframe
To: [EMAIL PROTECTED]
Cc: css-d@lists.css-discuss.org
Date: Monday, August 25, 2008, 6:08 PM
| If you give the parent container a width to contain the
| horizontal elements, the iFrame will get a horizontal
scroll bar.
|
| .photoThumbMainWrapper {width: 1685px;}
|
| That works if you know the number of thumbnails. Are you
| going to know the width? If not, let me know, and
i'll help
| you further.
|
| -Estelle
|
| URL: http://www.studentremix.org/test/ms/media.htm
| CSS: http://www.studentremix.org/test/ms/ms.css
|
Thanks, that does help. However, I've now decided to
use a div with
overflow:scroll to give the appearance of an iframe without
actually using
an iframe. Is there a way to get rid of the faded
out vertical scroll bar
that is not being used? Also, I am interested in hearing
your suggestion for
if I do not know the number of thumbnails or width that the
div needs to be.
Thanks for your help,
Daniel
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
