Re: [css-d] IE bug? Left-floated nav bar flickers in IE only
[EMAIL PROTECTED] wrote:
Hi,
I am desperate. I have a simple school site launching in a week and can't
find a fix! I have this issue ONLY in Internet Explorer.
I have a left nav bar that is floated to the left. Each link in the nav bar is
a list item. Within the lists item, the a link has ah a different color for
the hover mode. My issue is this: This nav bar renders correctly on Opera and
FireFox, but not on IE 6.0. On IE, the left nav flickers whenever the
pointer hovers, a very nasty, jarring effect. What could be wrong?
Here my URL for the web page: http://www.elcarmelo.paloaltopta.org/
(production site)
OR
http://cpotochny.com/PTA/ (development site)
And the style sheet: http://cpotochny.com/PTA/PTA.css (on the developlment
site)
I am copy/pasting the styles that pertain to the lef nav below, if that's
easier:
#navigation {
padding: 0px;
margin-top: 40px;
margin-right: 0px;
margin-bottom: 0px;
width: 175px;
float: left;
position: relative;
}
#navigation ul {
margin: 0px;
list-style-type: none;
padding: 0px;
}
#navigation li {
border-bottom-width: 2px;
border-bottom-style: solid;
border-bottom-color: #FF;
margin: 0px;
padding: 0px;
}
#navigation a:link {
font-weight: bold;
color: #FF;
text-decoration: none;
display: block;
padding: 9px 5px 9px 0.5em;
margin-right: 1px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.9em;
background-image: url(images/gradientW175.gif);
background-repeat: repeat-y;
border-left-width: 5px;
border-left-style: solid;
border-left-color: #66;
width: 175px;
}
#navigation a:visited {
font-weight: bold;
color: #FF;
text-decoration: none;
display: block;
padding: 9px 5px 9px 0.5em;
margin-right: 1px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.9em;
background-image: url(images/gradientW175.gif);
border-left-width: 5px;
border-left-style: solid;
border-left-color: #66;
background-repeat: repeat-y;
width: 175px;
}
#navigation a:hover {
font-size: 0.9em;
display: block;
color: #FF;
background-image: url(images/gradient_hoverW175.gif);
width: 175px;
}
#navigation a:active {
font-weight: bold;
color: #FF;
text-decoration: none;
display: block;
padding: 9px 5px 9px 0.5em;
margin-right: 1px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.9em;
background-image: url(images/gradientW175.gif);
background-repeat: repeat-y;
width: 175px;
}
Christine
Hi Christine,
First I checked the html: the html-validator
http://validator.w3.org/check?verbose=1uri=http%3A%2F%2Fwww.elcarmelo.paloaltopta.org%2F.
* Some errors, never good for IE (and others).
After repairing, the flashing IE was still there ... but also I noticed
uncommon behavior in FF: refreshing the page did hide some images! After
some more analysis I noticed there is a difference in the links to the
two urls where the page is.
In your own site, the calling of images from outside is forbidden, but
with different effects for IE and FF. - It is the vDeck machine on
your site, which causes this.
Compare: this testpage
http://home.tiscali.nl/developerscorner/css-discuss/test-dragon.htm
in FF and IE, trying in both browsers to refresh (refresh-button) and to
reload (Go-button). In FF: after a short flash of the middle image:
nothing! And: clicking on the link to the image in your site: for FF the
door is closed, but not for IE.
So: ??? - Anyway, the vDeck must be the dragon! ;-)
Back to the question. In a test page, I pointed all images to the
paloaltopta-site, but this didn't help.
Conclusion: indeed, it is IE himself ...
IE is not fast enough to change between the normal state (gradient)
background of a list item, and the background-img for the hover-state.
Solution is to apply two simplifications:
* The normal state of all li's is the same, so the gradient-img can
be used as a background for the whole ul; the white
border-bottom of the li's will divide the li's optical. In this
way, the fall back image is already there, and there is no chaning
of the li backgrounds needed to come there again.
* For the hover state there is no need of a separate hover
background image: is has a solid color, so can be replaced by
changing only tyhe background-color of a hovered li.
Is it true?
Testpage!
http://home.tiscali.nl/developerscorner/css-discuss/test-carmelo-new.htm
:-)
Succes with the deadline,
francky
btw:
Also in the header are some simplifications possible: no need for
floating, some text-align rules can do it. Then it will go better when
the font size is enlarged by a visitor. (See source code in the test page.)
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org --
Re: [css-d] Horizontal Nav Menu
Dean Champeau wrote: Help! For some reason, I can't figure out a simple horizontal menu... Nothing complicated, no dropdowns or submenus. Just a simple set of A tags that I'd like to be displayed horizontally in uniformly-sized blocks. I'm using an unordered list, and I've set my LI tags to inline and then the enclosed A tags to block. Shouldn't that work? For some reason, the A blocks go on their own lines. I want them to stay on the same line. I have a feeling I'm missing one little thing to make this work. [...] Hi Dean, Your feeling is right! :-) Delete the block for the a's , and ... hocus pocus ... they don't display as a block (each on a new line below each other). Testpage is here http://home.tiscali.nl/developerscorner/css-discuss/test-dean.htm. Greetings, francky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] pure css pop up
Hi
I'm having a problem with a css menu, the idea is that when the list
element is hovered over the menu is displayed. My code works on FF,
Safari but not IE, when i hover in IE nothing happens, see the code
below, any ideas i've tried a few tweaks to no avail.
CSS Code:
/* regional choice menuing */
#regional_choice{
clear:both;
width:390px;
margin:auto;
position:relative;
top:10px;
left:160px;
}
#regional_choice ul{
float:right;
position:relative;
top:-5px;
left:-10px;
margin: 0;
padding: 0;
list-style: none;
width: 135px;
}
#regional_choice ul li {
position: relative;
}
#regional_choice li ul {
position: absolute;
left: 0px;
top: 0px;
display: none;
border:1px solid black;
padding:10px;
background:url(_images/region_bg.jpg) no-repeat;
z-index:30;
}
#regional_choice ul li a {
display: block;
text-decoration: none;
color: navy;
padding: 5px;
}
#regional_choice ul li a:hover {
color:#66;
}
#regional_choice li:hover ul { display: block; }
HTML code:
div id=regional_choice
style=padding-right:30px;font-family:Verdana, Arial, Helvetica,
sans-serif;font-size:0.7em;font-weight:bolder;color:#808080;text-align:right;margin-bottom:-11px;
span style=float:left;
You're currently in the Americas region.
/span
ul
lia href=# style=color:#777;img
src=_images/region_menu.gif border=0 /Change region./a
ul
liCanada/USA/li
lia href=http://www.arcolectric.co.uk/index2.html;Europe/a/li
lia href=http://www.arcolectric.co.uk/index2.html;Rest of the
world/a/li
/ul
/li
/ul
/div
--
Regards
Terry O'Leary
Web Developer @ The Elektron Group
~Online dating community ? www.d8-m8.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Vertical spacing strangeness
I have just done an update of a site and have noticed something strange. The menu buttons on the left navigation look fine on Safari and IE but not on Firefox: the vertical spacing in Firefox is about twice what it should be. http://www.bizzytots.com/ I'm sure it's something simple but another pair of eyes would be really useful. Thanks, Ian. -- Dr Ian M Piper [EMAIL PROTECTED] skype: ianmpiper -- Where is the wisdom we have lost in knowledge? Where is the knowledge we have lost in information? __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] pure css pop up
Terry O'Leary wrote: Hi I'm having a problem with a css menu, the idea is that when the list element is hovered over the menu is displayed. My code works on FF, Safari but not IE, when i hover in IE nothing happens, see the code below, any ideas i've tried a few tweaks to no avail. Unfortunately IE doesn't support :hover on anything but a elements. I think IE7 does, though (anyone know?) -- Joel Goldstick www.columbuswebmakers.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] mac/ie5.2 float drop @ 800
Browsercam shows one of the center float columns (#nav) dropping in mac/ie5.2 (osx 10.3 and 10.4) @ 800 screen resolution. browsercam captures: http://www.browsercam.com/public.aspx?proj_id=275870 site uri: http://www.chelseacreekstudio.com/ css: embedded Seeking fix (or condolence :-) ). Thanks. ~dL __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] page jumping in FF if not enough text
In Firefox/Win (several versions), I'm finding that although these two pages differ only in amount of text (and not at all in style or php), when I switch from one to another, the page jumps (to the left going from the first to the second, back to the right otherwise). I know that if I add or delete text so that the footer appears on both or on neither when the page loads this jumping stops. It does not happen in IE 6.02/Win, even with the differing lengths of text. Can someone tell me what's happening, and how to suppress this behavior without having to have a lot of empty space (without some sort of min-height div)? Thanks!! Pages: http://www.gmavt.net/~ktalmage/thirdsector/publicpart.php http://www.gmavt.net/~ktalmage/thirdsector/grantwriting.php -- Kir Talmage http://www.metasilkwebworks.com email: [EMAIL PROTECTED] tel: (802) 238-5118 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] page jumping in FF if not enough text
metasilk wrote: In Firefox/Win (several versions), I'm finding that although these two pages differ only in amount of text (and not at all in style or php), when I switch from one to another, the page jumps (to the left going from the first to the second, back to the right otherwise). I know that if I add or delete text so that the footer appears on both or on neither when the page loads this jumping stops. It does not happen in IE 6.02/Win, even with the differing lengths of text. Can someone tell me what's happening, and how to suppress this behavior without having to have a lot of empty space (without some sort of min-height div)? Thanks!! Pages: http://www.gmavt.net/~ktalmage/thirdsector/publicpart.php http://www.gmavt.net/~ktalmage/thirdsector/grantwriting.php Start by making sure your document validates - there seem to be a number of validation errors! You're using XHTML Strict so, for example, you should not use border= in mark-up (set in CSS). Then perhaps repost? Mike A. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Problems with IE, position:absolute and content stretched
Hello! I've got a problem with my homepage. In firefox everything is fine, but in IE it's not. Here is the url, so you can see what I mean: http://www.erdeanthomas.de/ In IE, the content-div is stretched under the rsidebar und lsidebar, but it should be between. I gave the lsidebar und rsidebar a constant width, because of the two pictures (sunset). Why does IE take the border of the body to define the width, and not like firefox the border of the two sidebars, and what can I do? Second problem are the two pictures (sunset). My footer contains a second div named footer-inside, my whole page is build up like that. I set these pictures with position:absolute to the footer-inside div, to provide that they are parallel in height und at the bottom of the page. The footer-inside div is centered in IE, but I don't know why? Here is my style.css: http://www.erdeanthomas.de/wp-content/themes/thomas/style.css And here is my index.php: http://www.erdeanthomas.de/wp-content/themes/thomas/index.phps Regards, Thomas __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Show more text using CSS
At 03:08 PM 8/9/2006, Christian Heilmann wrote: Basically, we need some way to code a Show More function that would allow us to take a long piece of text, shorten it to X maximum lines, then have a Read more link that when clicked would display the rest of the text on the page below the first half. There you go: http://icant.co.uk/sandbox/morecontentlinks/ I didn't use any fancy word counting or anything, but instead you need to set a div with the class more around all the elements you want hidden. Great, thanks! I will play around with implementing it on our pages. One more thingHow would you do a Hide link to make the extra text disappear after you're done reading it? Added this functionality... -- Chris Heilmann Book: http://www.beginningjavascript.com Blog: http://www.wait-till-i.com Writing: http://icant.co.uk/ Thanks, Chris. I was able to get the code you sent to work with our text. However, I'm wondering if there's a much less complicated formula for getting this to work like that blog site without having to link to 4 js files? __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] page jumping in FF if not enough text
metasilk wrote: In Firefox/Win (several versions), I'm finding that although these two pages differ only in amount of text (and not at all in style or php), when I switch from one to another, the page jumps (to the left going from the first to the second, back to the right otherwise)..] It is not happening on my end (if I understand what you mean). You may have experienced short-page shift. If that's what it was, this articlehttp://www.communitymx.com/content/article.cfm?cid=528A0 by Zoe Gillenwater explains it and offers solutions. Pages: http://www.gmavt.net/~ktalmage/thirdsector/publicpart.php http://www.gmavt.net/~ktalmage/thirdsector/grantwriting.php __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] page jumping in FF if not enough text
Kir,
It's the lack/presence of vertical scrollbars. Add this fix to your CSS
file, and then build pages that validate :-)
html {height: 100%; margin-bottom: 0.1px; font-size: 100%;}
Regards,
- Rahul.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] page jumping in FF if not enough text
Dear Mike css-crew: metasilk wrote: In Firefox/Win (several versions), I'm finding that although these two pages differ only in amount of text (and not at all in style or php), when I switch from one to another, the page jumps (to the left going from the first to the second, back to the right otherwise). I know that if I add or delete text so that the footer appears on both or on neither when the page loads this jumping stops. It does not happen in IE 6.02/Win, even with the differing lengths of text. Can someone tell me what's happening, and how to suppress this behavior without having to have a lot of empty space (without some sort of min-height div)? Thanks!! Pages: http://www.gmavt.net/~ktalmage/thirdsector/publicpart.php http://www.gmavt.net/~ktalmage/thirdsector/grantwriting.php Start by making sure your document validates - there seem to be a number of validation errors! You're using XHTML Strict so, for example, you should not use border= in mark-up (set in CSS). Then perhaps repost? Mike A. Thanks for the quick reply! It's valid XHTML CSS now. But... still jumping! So, reposting. (Tricksy stuff, this. ) http://www.gmavt.net/~ktalmage/thirdsector/publicpart.php http://www.gmavt.net/~ktalmage/thirdsector/grantwriting.php -- Kir Talmage http://www.metasilkwebworks.com email: [EMAIL PROTECTED] tel: (802) 238-5118 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] page jumping in FF if not enough text: FIXED (short-page shift)
Hey, thanks David Rahul (and Zoe) for the fix! It's working (of
course). You guys are great.
metasilk wrote:
In Firefox/Win (several versions), I'm finding that although these two pages
differ only in amount of text (and not at all in style or php), when I
switch from one to another, the page jumps (to the left going from the first
to the second, back to the right otherwise)..]
David Laakso wrote:
It is not happening on my end (if I understand what you mean). You may
have experienced short-page shift. If that's what it was, this
articlehttp://www.communitymx.com/content/article.cfm?cid=528A0 by Zoe
Gillenwater explains it and offers solutions.
Rahul Gonsalves wrote:
It's the lack/presence of vertical scrollbars. Add this fix to your CSS
file, and then build pages that validate :-)
html {height: 100%; margin-bottom: 0.1px; font-size: 100%;}
--
Kir Talmage
http://www.metasilkwebworks.com
email: [EMAIL PROTECTED]
tel: (802) 238-5118
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Hover problems in IE
I'm working with a page I inherited that is exhibiting strange hover problems in IE. http://www.als.uiuc.edu/default-1.htm The Quick Links section hover is not acting according to the style sheets. In Firefox it behaves correctly but in IE the Hover causes the main photo to shift about 10px to the left and lines to appear across the entire page. Any ideas or hacks come to mind? -Tim -- ** Tim Offenstein - Web Specialist - CITES - ALS - 244-2700 * IGPA - 244-1398 ** A cheerful heart is a good medicine Proverbs 17:22 NRSV __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] New to CSS and need help positioning
Hi, I'm new to CSS - about 3 weeks into it. I've been working on this page trying to get CDs to line up under each other and off to the right, the corresponding MP3 list to listen, and chord charts next to that. Can anyone look at this and see where I've gone wrong, please? Thanks in advance. Link: www.blastoffmusic.org/downloads/downloads2.php Kat __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] a body footer
Is a footer 100% width that is anchored to the bottom of the browser possible? Couldn't find any tutorials Ta, R. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] a body footer
Is a footer 100% width that is anchored to the bottom of the browser possible? Couldn't find any tutorials Ok, seriously, are you taking the micky? http://css-discuss.incutio.com/?page=HundredPercentHeight http://css-discuss.incutio.com/?page=FooterInfo I keep getting the impression you are just here to ask questions that are already on the wiki and have been resolved dozens of times. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Display image on hover - not working in IE6
Once again I'm having trouble with IE6. I have a page which displays a list of artists names for a gallery. When the user hovers their cursor over the name it displays a thumbnail of their artwork to the right of the list of names. Works fine in all the normal suspects (Firefox, Opera, Safari…) but not in IE6. I am already using csshover.htc and it works fine as can be seen in the menus. The URL is http://www.aegisgallery.com/artists/index.html The CSS is: http://www.aegisgallery.com/basic.css The relevant part of the CSS starts at line 109 with #artists. Suggestions? Tom Keenan [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Show more text using CSS
Janet Chang wrote: At 03:08 PM 8/9/2006, Christian Heilmann wrote: Basically, we need some way to code a Show More function that would allow us to take a long piece of text, shorten it to X maximum lines, then have a Read more link that when clicked would display the rest of the text on the page below the first half. There you go: http://icant.co.uk/sandbox/morecontentlinks/ I didn't use any fancy word counting or anything, but instead you need to set a div with the class more around all the elements you want hidden. Great, thanks! I will play around with implementing it on our pages. One more thingHow would you do a Hide link to make the extra text disappear after you're done reading it? Added this functionality... -- Chris Heilmann Book: http://www.beginningjavascript.com Blog: http://www.wait-till-i.com Writing: http://icant.co.uk/ Thanks, Chris. I was able to get the code you sent to work with our text. However, I'm wondering if there's a much less complicated formula for getting this to work like that blog site without having to link to 4 js files? Can't answer for Chris, don't know anything about javascript; and you did not provide, nor do I have, the link to the blog site you mention or your site. Since hot-metal has about as much relevance on a css list as javascript, I'd consider a print media method. Set the first p default flush left/scatter right. Then each succeeding p at at a reduced font-size and reduced lead with an indent first sentence. Best, ~dL __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Display image on hover - not working in IE6
For anyone who may have worked on this - I apologize. I did what I always preach - after I sent my email. I tried validating the html and css. (Thought I had already done that.) And the small errors - which seemed irrelevant - fixed the problem. Mea culpa. Tom Keenan [EMAIL PROTECTED] On Aug 10, 2006, at 9:10 AM, Tom Keenan wrote: Once again I'm having trouble with IE6. I have a page which displays a list of artists names for a gallery. When the user hovers their cursor over the name it displays a thumbnail of their artwork to the right of the list of names. Works fine in all the normal suspects (Firefox, Opera, Safari…) but not in IE6. I am already using csshover.htc and it works fine as can be seen in the menus. The URL is http://www.aegisgallery.com/artists/index.html The CSS is: http://www.aegisgallery.com/basic.css The relevant part of the CSS starts at line 109 with #artists. Suggestions? Tom Keenan [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Show more text using CSS
Janet justifiably interjected... Basically, we need some way to code a Show More function that would allow us to take a long piece of text, shorten it to X maximum lines, then have a Read more link that when clicked would display the rest of the text on the page below the first half. (snip, slash) Thanks, Chris. I was able to get the code you sent to work with our text. However, I'm wondering if there's a much less complicated formula for getting this to work like that blog site without having to link to 4 js files? Janet, Just a question from a beginner...wouldn''t it just be a lot easier to make a second page like the first, except with the extended text on it the way you want it to look? T'would certainly save a lot of JS and coding hassle... Just a thought. Dave Pierce __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Show more text using CSS
Thanks, Chris. I was able to get the code you sent to work with our text. However, I'm wondering if there's a much less complicated formula for getting this to work like that blog site without having to link to 4 js files? Janet, Just a question from a beginner...wouldn''t it just be a lot easier to make a second page like the first, except with the extended text on it the way you want it to look? T'would certainly save a lot of JS and coding hassle... Just a thought. !--more-- in Wordpress :-) This is all off-topic for CSS by now, so let's stop. There is a CSS only hack: http://www.cssplay.co.uk/menu/more.html -- Chris Heilmann Book: http://www.beginningjavascript.com Blog: http://www.wait-till-i.com Writing: http://icant.co.uk/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Navigation - Roll-Over Effect
Mathew, Change your #nav a:hover to #mainnav a:hover. That seems to fix it for me. Finally, an error I can help with :-). Regards, Rahul. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Navigation - Roll-Over Effect
At the end of the CSS file you have #nav a:hover instead of #mainnav a:hover - Bethany On 8/10/06, Matthew Stoneback [EMAIL PROTECTED] wrote: Need some guidance with something.. I developed a main navigation bar for a client's site using a demonstration from the book, Bulletproof Web Design. In doing this, I changed some of the CSS and XHTML to suit my design. After everything was all said and done, I can not get the roll-over effect to work (Hovering Swap). I believe have made a mistake in the last CSS rule as everything was looking good before then. Can anyone spot the problem? Here are the links to my test HTML and CSS documents. XHTML: http://www.eddysound.com/tams/test_pages/navtest.htm CSS: http://www.eddysound.com/tams/test_pages/navtest.css Thanks in advance for your help. Matthew Stoneback __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] New to CSS and need help positioning
Having started learning CSS only three weeks ago, my site does have some tables. However, in my defense, I did create 2 table-less pages index and gallery last week. So not all hope is lost! :-D I did what you suggested Tyson and that helped a lot; however, my text still runs together. I've uploaded it again. I even tried a margin-top to see if it helped. Nope. Any ideas? Thanks again! Kat -Original Message- From: Tyson Tate [mailto:[EMAIL PROTECTED] Sent: Thursday, August 10, 2006 10:06 AM To: Kathryn Olds Subject: Re: [css-d] New to CSS and need help positioning Eeek! Tables for layout! Evil! Anyways, add clear: left to your CDContent class. -Tyson On 8/10/06, Kathryn Olds [EMAIL PROTECTED] wrote: Hi, I'm new to CSS - about 3 weeks into it. I've been working on this page trying to get CDs to line up under each other and off to the right, the corresponding MP3 list to listen, and chord charts next to that. Can anyone look at this and see where I've gone wrong, please? Thanks in advance. Link: www.blastoffmusic.org/downloads/downloads2.php Kat __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Navigation - Roll-Over Effect
Ah yes I was up way too late last night and could not figure it out. I am a little red in the face, but thankful. Thanks, Matthew Stoneback __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Header not there on IE
After the last help, let me try another problem I posted once before. Alright everyone, my CSS and URL is linked below. Basically what I am trying to do is float the header image over top of the rest of the page. I wanted to make the header image overlap the main content area as well as the left side nav bar. The layout looks great (and correct) in all of the browsers except Internet Explorer. As last time - any help would be greatly appreciated. I am new to designing with CSS and am trying to learn how to do things by the standards. CSS: http://www.eddysound.com/tams/style/tams.css URL: http://www.eddysound.com/tams/index1.htm Description of Desired Layout: http://www.eddysound.com/tams/Design%20Problem.bmp If a screen shot is needed for better understanding just let me know and I will show you what I have going on here on my system. Thanks, Matthew Stoneback __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Header not there on IE
taking out the float: left from #main popped the logo right up for me. with this in mind, i suggest not even floating the #main. you don't need to from what i see. simply give #main a left margin wide enough to accomodate the left navigation. off the original topic, i get a scroll bar in my browser, which is always set to 800x600. if you're trying to accomodate this resolution (and it seems like you are since your min width is 600), try going to 574px or so. remember the scrollbar and the borders of the browser take away from that 600px width. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Interesting problem in Firefox (latest) on Windows 2000
Hi there, Hoping I might be able to get a little advice on this annoying issue that I struggled with (for too long!) this morning. I have a site with a simple horizontal tabbed navigation (http://www.copycamp.ca) and it look good across all (most?) major browswers _except_ for Firefox on Windows 2000. This is something I've not come across before, as I usually find that sites viewed in Firefox on OS X and Windows are often identical. The issue is the 2px space between the tabs and the #content div. Any thoughts appreciated. And, if you could CC me, that would be super, as I'm on digest. Also, I suspect that there are many other improvements that could be made -- so please feel free to make them. :-) Many thanks in advance, Phillip. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] mac/ie5.2 float drop :: resolved
David Laakso wrote:
Browsercam shows one of the center float columns (#nav) dropping in
mac/ie5.2 (osx 10.3 and 10.4) @ 800 screen resolution.
browsercam captures:
http://www.browsercam.com/public.aspx?proj_id=275870
site uri: http://www.chelseacreekstudio.com/
css: embedded
Seeking fix (or condolence :-) ).
Thanks.
~dL
This has been resolved thanks to an off-list reply from Holly Bergevin.
Holly's solution was to feed a narrower width to the column within a
mac-only filter.
/*\*//*/
#nav {width: 14%!important;}
/* width adjustment for mac ie5.2 */
Thank you, Holly!
David
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Header not there on IE
Cj - thanks for the help, I have fixed and uploaded the files to the same address. It still looks great in everything but IE. The header is there, but the layout has been devastated, Any ideas? Btw, I knew I needed to adjust the fixed size. Thanks for the reminder. Once I get all the other bugs worked out, I am going to scale down the 600px section. Thanks again for the help, Matthew Stoneback __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] A floated column leaps leftward if IE window is resized
Hey again, I have a floated column that should appear on the left. It's less important info, so in order that the content appear as high in sourcse as possible, this left-col uses negative margins. It works just fine in FireFox (haven't tested Opera yet, and have trouble getting to Safari-running machines). On the other hand, if I resize the window in IE/Win, the column leaps to the right, and stays there unless I reload the page. Yikes! Can you help? One of the afftected pages: http://www.greenmountainaccess.net/~ktalmage/thirdsector/pubclient.php the relevant CSS file: http://www.greenmountainaccess.net/~ktalmage/thirdsector/style/3s_basic.css Thanks! -- Kir Talmage http://www.metasilkwebworks.com email: [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Hover problems in IE
I haven't resolved this but decided to let go of the nice hover background color for now. The whole effort works great on http://www.kch.uiuc.edu (another page I did). But on the ALS page there's a wild float somewhere messing IE up. I can't locate a reference to the IE hover/float issue that I read about some time ago, if anyone has a reference to pass my way, it would be greatly appreciated. -Tim I'm working with a page I inherited that is exhibiting strange hover problems in IE. http://www.als.uiuc.edu/default-1.htm The Quick Links section hover is not acting according to the style sheets. In Firefox it behaves correctly but in IE the Hover causes the main photo to shift about 10px to the left and lines to appear across the entire page. Any ideas or hacks come to mind? -Tim -- ** Tim Offenstein - Web Specialist - CITES - ALS - 244-2700 * IGPA - 244-1398 ** A cheerful heart is a good medicine Proverbs 17:22 NRSV __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ -- ** Tim Offenstein - Web Specialist - CITES - ALS - 244-2700 * IGPA - 244-1398 ** A cheerful heart is a good medicine Proverbs 17:22 NRSV __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] ie css spacing problem
Hi, Could someone please tell me how to fix this spacing problem in the left menu for ie only? http://www.landisbrewer.com/agents2.html The css is #links for the link images. Thank you! Sincerely, Melinda Odom Design Hosting, Inc. www.designhosting.biz 479-471-0891 -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.405 / Virus Database: 268.10.8/414 - Release Date: 8/9/2006 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] ie css spacing problem
I just found this hack which seems to be working:
/* Holly Hack: Hide From IE5/Mac \*/ * html img { margin: 0px 0;
vertical-align: middle; } * html input { margin: 0px 0; vertical-align:
middle; } /* Holly Hack: End Hide From IE5/Mac */
Always seem to find the fix right after you mail to the list for help :)
Sincerely,
Melinda Odom
Design Hosting, Inc.
www.designhosting.biz
479-471-0891
-Original Message-
From: Melinda Odom [mailto:[EMAIL PROTECTED]
Sent: Thursday, August 10, 2006 2:38 PM
To: css-d@lists.css-discuss.org
Subject: ie css spacing problem
Hi,
Could someone please tell me how to fix this spacing problem in the left
menu for ie only?
http://www.landisbrewer.com/agents2.html
The css is #links for the link images.
Thank you!
Sincerely,
Melinda Odom
Design Hosting, Inc.
www.designhosting.biz
479-471-0891
--
No virus found in this outgoing message.
Checked by AVG Free Edition.
Version: 7.1.405 / Virus Database: 268.10.8/414 - Release Date: 8/9/2006
--
No virus found in this outgoing message.
Checked by AVG Free Edition.
Version: 7.1.405 / Virus Database: 268.10.8/414 - Release Date: 8/9/2006
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] IE7 - Extra bottom margin on flyout navigation items
IE7 is adding, what appears to be, extra bottom margin to my navigation list
items. I'm using a CSS flyout method that I found at
http://solardreamstudios.com/learn/css/cssmenus/
I've posted an example at:
http://www.stanford.edu/~aaronc/navTest.htmlhttp://www.stanford.edu/%7Eaaronc/navTest.html
There is a green background on the ul element to make the extra spacing more
obvious (it only shows up in IE7).
The source of the problem seems to be caused by the selector found at line
38 in the source code.
ul#navmenu li {
display: block !important;
display: inline;
position: relative;
}
I'm open to using another method if someone has one.
Any ideas?
TIA,
Aaron
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Header not there on IE
i don't remember what all i changed here, but you can look through it
and compare it to yours. keep in mind that in order to change css on
my computer i had to save the page to my machine, so your image
locations are off in this paste.
#header {
height: 100px;
left: 50px;
position: absolute;
top: 25px;
width: 700px;
z-index: 1;
}
#header img {
border: 1px solid #00;
}
#completepage {
background-color: #cc;
border: 1px solid #00;
margin-left: auto;
margin-right: auto;
}
#sidebar {
background-image: url(../images/sidebar.gif);
background-repeat: repeat-y;
color: #ff;
float: left;
width: 200px;
}
#sidebar div.padding {
padding-left: 20px;
padding-right: 20px;
padding-top: 150px;
}
#main {
margin-left: 200px;
}
#main div {
padding-left: 15px;
padding-right: 15px;
}
#navigation {
padding-top: 150px;
}
p.navbar {
border: 1px dashed #00;
font-size: 1.3em;
padding: 5px;
text-align: center;
}
#content {
}
.clearfix:after {
clear: both;
content: .;
display: block;
height: 0;
visibility: hidden;
}
/* save ie/mac \*/
* html .clearfix {
height: 0;
}/* end save */
#footer {
margin-left: auto;
margin-right: auto;
text-align: center;
}
body {
background-color: #99;
color: #00;
font-family: Palatino, Times New Roman, Times, serif;
font-size: 1em;
}
p {
}
h1 {
font-size: 1.5em;
font-weight: bold;
}
h2 {
font-size: 1.3em;
font-weight: bold;
}
h3 {
font-size: 1em;
}
#leftnav {
width: 160px;
}
#leftnav ul {
list-style-type: none;
padding: 10px;
}
#leftnav li {
border-bottom: 1px dashed #ff;
padding-bottom: 5px;
padding-top: 5px;
text-align: center;
}
#leftnav li.top {
border-top: 1px dashed #ff;
padding-top: 5px;
}
#leftnav a {
color: #ff;
text-decoration: none;
}
#leftnav a:visited {
color: #ff;
}
#leftnav a:hover {
color: #66;
}
#leftnav a:active {
text-decoration: none;
}
.heading {
text-align: center;
}
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Is this doable using css? (align, margin, headers)
Hi Erik,
I have a tricky question.
First have a look at this image http://dev.heureka.se/CSSProblem.jpg .
Without changing the html markup I want to align the anchors along the
red line (~100px from the left edge). The emphasized text can be of
different lengths.
div class=adblock
h2
ema class=adtype-40 href=# title=Säljes/a/em
a href=#Dior skor/a
span title=Inlagd(13 jul)/span
/h2
...
/div
Consider giving the EM element a fixed width corresponding to the
images' width and float it left.
To keep the text aligned with the following link also change the line
height to 1.2/0.7, which is approximately 1.71:
.adblock h2 em { /* AdType */
font-size : 0.7em;
font-style: normal;
text-transform: uppercase;
display : block;
float : left;
width : 100px; /* image width */
line-height : 1.71em;
}
Cheers,
jens
--
Jens Brueckmann
http://www.yalf.de
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Class Won't Apply Itself
I'm confused over classes that sometimes just won't apply.
Page in question:
www.springfieldmogov.org/founders/concerts.html
CSS:
www.springfieldmogov.org/css/founders.css
The list of concerts on this page should NOT be showing any bullets,
custom or otherwise. But in IE it does, despite the UL having been
given a class=noBull That class successfully negates the custom
bullets in other browsers.
But, even in other browsers, the bullets wouldn't go away by JUST
defining a class rule like:
.noBull {list-style:none;}
and then applying that class to a ul in my html code.
I couldn't get the bullets to disappear until explicitly defining the rule as:
#content .noBull {list-style:none;}
Why?
How can I get IE to eliminate the bullets on this page and respect the
.class=noBull?
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Using a:active on the focus page
CSS-D List: Currently, I am trying to make pseudo-class selector e.g., .class a:active work on a page where the selected navigation link remains highlighted in a different color. Does anyone have any examples of this? Thanks, ~S __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Using a:active on the focus page
#act {width :120px; background-color : blue; color : white;} (placed on the
page)
a class=xyz id=act href=page.htmlYour Page Name/a
This is a simple example but it works. The only problem is that it goes on
each page. There may be better ways but this works in all the browsers I
have checked.
Don
- Original Message -
From: Spencer Ivery [EMAIL PROTECTED]
To: css-d@lists.css-discuss.org
Sent: Thursday, August 10, 2006 1:46 PM
Subject: [css-d] Using a:active on the focus page
| CSS-D List:
|
| Currently, I am trying to make pseudo-class selector e.g., .class a:active
| work on a
| page where the selected navigation link remains highlighted in a different
| color.
|
| Does anyone have any examples of this?
|
| Thanks,
|
| ~S
|
|
|
| __
| css-discuss [EMAIL PROTECTED]
| http://www.css-discuss.org/mailman/listinfo/css-d
| IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
| List wiki/FAQ -- http://css-discuss.incutio.com/
| Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
|
|
|
| --
| No virus found in this incoming message.
| Checked by AVG Free Edition.
| Version: 7.1.394 / Virus Database: 268.10.8/415 - Release Date: 8/9/2006
|
|
--
No virus found in this outgoing message.
Checked by AVG Free Edition.
Version: 7.1.394 / Virus Database: 268.10.8/415 - Release Date: 8/9/2006
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Test Navigation Incorporated into Site - Doesn't Work
Once again, hello to all. So I have been helped out twice today and once again I wanted to say thanks. My new problem is incorporating my test navigation into my site. Test Nav URL: http://www.eddysound.com/tams/test_pages/navtest.htm My index page with the about navigation added in: http://www.eddysound.com/tams/index.htm My CSS Document: http://www.eddysound.com/tams/style/help.css As you can see, when I place the navigation into my HTML document and add the CSS into my help.css file, something strange happens. On top of everything, the list style reappears in every browser but IE.. Weird! Any ideas on how to make this navigation function? I want the navigation to sit flush against the left side navigation and extend all the way across the light grey area. Thanks in advance, Matthew Stoneback (Mr. I am full of problems today.) __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Fluid layout problem IE
Is there a way to prevent IE6 from pushing the sidebar content under the maincontent when resizing the window to a small width? In FF the layout (please do not take notice of the colours) works, but I have that problem with IE. http://www.bonn-castell.de/test/template.php Thank you! Martin __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] One floating li ? (Converting a table to li)
Hi All! New to the List I'm looking for help on a problem with a td that has a *-width.. I dont understand how this is supposed to be done i CSS for coding Strict Valid html. Hos is this done? Can anyone help me? table width=100% border=0 cellspacing=0 cellpadding=5 tr td width=100a href=/a/ class=menyLankA/a/td td width=100a href=/b/ class=menyLankB/a/td td width=100a href=/c/ class=menyLankC/a/td td width=100a href=/d/ class=menyLankD/a/td td width=*nbsp;/td -- This is the one causeing me problems.. td width=100a href=/e/ class=menyLankE/a/td td width=100a href=/f/ class=menyLankF/a/td /tr /table Best Regards /Henrik Jutterström -- tel 070-714 66 66 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Problems with header
I am working on a site at http://dev.northernfarce.com/gammaone/news.php I am having some trouble getting the header to look right. It looks right in Firefox on both Linux and Windows, looks close to right in Opera and looks wrong in IE. For clarity's sake I have this screen cap taken from FireFox. http://dev.northernfarce.com/gammaone/header.png That is what the header should look like. Any suggestions or help would be much appreciated. Thanks, Roy __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Test Navigation Incorporated into Site - Doesn't Work
Hi Matthew, My CSS Document: http://www.eddysound.com/tams/style/help.css As you can see, when I place the navigation into my HTML document and add the CSS into my help.css file, something strange happens. On top of everything, the list style reappears in every browser but IE.. Weird! Any ideas on how to make this navigation function? you make use of SGML comment syntax in your Style sheet instead of CSS comments, e.g. you use !--beginning of left navigation styles-- instead of /* beginning of left navigation styles */ Please change your erroneous syntax and see if the flawed rendering still remains. Cheers, jens -- Jens Brueckmann http://www.yalf.de __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Is this doable using css? (align, margin, headers)
Consider giving the EM element a fixed width corresponding to the
images' width and float it left.
To keep the text aligned with the following link also change the line
height to 1.2/0.7, which is approximately 1.71:
.adblock h2 em { /* AdType */
font-size : 0.7em;
font-style: normal;
text-transform: uppercase;
display : block;
float : left;
width : 100px; /* image width */
line-height : 1.71em;
}
Cheers,
jens
--
Jens Brueckmann
http://www.yalf.de
Excellent! Vielen dank :-)
There is one more thing I forgot to ask about. In IE6 the divs are
moving around a few pixels when hovering the links. Any ideas?
/Erik
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Class Won't Apply Itself
On 8/10/06, Chris Akins [EMAIL PROTECTED] wrote:
Why?
How can I get IE to eliminate the bullets on this page and respect the
.class=noBull?
I think it is an unexpected inheritance problem. where the more
generic list-style doesn't overrule the list-style-image property.
Anyway you can use this:
#content .noBull {list-style-image:none;}
This should give you the expected result in IE.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Test Navigation Incorporated into Site - Doesn't Work
Jens - Thank you for the help. You were right; all I had to do was fix the comment syntax and the navigation bar returned to normal. I am starting to get the hang of CSS slowly but surely. Thanks! Matthew Stoneback __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] DIV doesn't get heigt by content in FF, Opera etc.
In the link below i have 2 DIV's. (red and black border) In IE the DIV's get their height from the amount of content. But that doesn't happen in FF, Opera etc. Any fix or explanation? http://www.dammark.net/files/html/autoliften/ Regards // Sebastian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Selected and Hover Effect Using CSS
Problem -
I would like my main navigation to be yellow on each page as it is pulled up
by the browser. I currently am using an external style sheet with this rule
included in it:
#mainnav a:hover, #navigation #home a {
color: #00;
padding-bottom: 5px;
border-color: #00;
background: #cc url(../images/yellow_main_nav.gif) repeat-x
top left;
}
This works for making all of the #mainav to have a hover / image swap
effect, but only leaves the home tab highlighted on each page instead of
switching as each page is pulled from the server. I know I can put a CSS
rule in each individual HTML file to have the correct button yellow per
page, but I was wondering if there was a way to do this effect from an
external style sheet. I have been looking all over the web, and found some
diagrams on how to do this, but none are completed by using just CSS. Am I
missing something?
Here is the URL: http://www.eddysound.com/tams/index.htm
Go from the home page to each of the other pages and you will see that
Home stays yellow on each page instead of switching to the proper tab.
Any help?
Thanks,
Matthew Stoneback
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Interesting problem in Firefox (latest) on Windows 2000
Phillip Smith wrote:
Hi there,
Hoping I might be able to get a little advice on this annoying issue
that I struggled with (for too long!) this morning. I have a site
with a simple horizontal tabbed navigation (http://www.copycamp.ca)
and it look good across all (most?) major browswers _except_ for
Firefox on Windows 2000. This is something I've not come across
before, as I usually find that sites viewed in Firefox on OS X and
Windows are often identical. The issue is the 2px space between the
tabs and the #content div.
Any thoughts appreciated. And, if you could CC me, that would be
super, as I'm on digest. Also, I suspect that there are many other
improvements that could be made -- so please feel free to make
them. :-)
Many thanks in advance
Hi Phillip,
On my Win98SE I see also a difference between FF and IE: FF (vs. 1.0.7)
is showing the 3px gap under the tabs. Like the world is upside down: I
thought IE had the copyright for the 3px bug! ;-)
My suggestion should be to fix the html-errors first, for the
error-handling of browsers on different systems can be different.
The html-validator has some tips
http://validator.w3.org/check?verbose=1uri=http%3A%2F%2Fwww.copycamp.ca%2Fnode.
After that, the css-validator can work too (1 error in
copycamp/style.css
http://jigsaw.w3.org/css-validator/validator?profile=css2warning=2uri=http%3A%2F%2Fwww.copycamp.ca%2Fthemes%2Fcopycamp%2Fstyle.css).
If this doesn't work, you could try to add {margin-top:-3px;) for the
#content, like you did for IE in the conditional comment (maybe some
more padding-bottom in the tabs is needed for compensation).
Other suggestion: the font size of the #content tastes a bit too heavy,
while the font-size of the side bar on the right side is a bit too
small. I guess a better balance can be made. Example in screenshot here
http://home.tiscali.nl/developerscorner/css-discuss/images/screenshot-copycamp.png.
Greetings,
francky
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] DIV doesn't get heigt by content in FF, Opera etc.
Sebastian Dammark wrote:
In the link below i have 2 DIV's. (red and black border)
In IE the DIV's get their height from the amount of content.
But that doesn't happen in FF, Opera etc.
Any fix or explanation?
http://www.dammark.net/files/html/autoliften/
FF, Opera etc. are behaving correctly: containers shall not expand
beyond given dimensions - unless told to do so.
IE expands everything by default *when* we give an element dimensions,
because of its 'hasLayout'[1] bug.
Solution: tell FF, Opera etc. to expand and contain what's inside,
regardless of given dimensions - i.e.: make container behave like a table...
#topholder, #contentholder {display: table;}
...and allow contentarea to grow too...
#contentarea {height: auto;}
regards
Georg
[1]http://www.satzansatz.de/cssd/onhavinglayout.html
--
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
