[css-d] RE:Hover/click and expand help needed
Have you tried to set #programs_menu to position:absolute? I think the problem occure because your menu relate to top/left border of window. This is handled different in IE and Firefox. Lars Fyrileiv Thanks to all for trying to help! I got further requirements and I have a draft version based on some code Dreamweaver spat: http://websage.net/new/programs_menu.htm The CSS and JS code are respectively: http://websage.net/new/mm_css_menu.js http://websage.net/newprograms_menu.css The issues I have are: - There is a gap between the flyout menu and the table; that gap is not the same in Firefox and IE - I need to have vertical bars between the table cells; I currently have border on the whole table. When trying to put cell borders, they became double with the table border. Thanks for your help! Mitko __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
RE: [css-d] Opacity in Suckerfish -- stacking layers
I posted this question in the stacking layers mail, but until now I haven't received a satisfying reply to that. Arno Have you (or anyone else) figured out why the menu disappears when your menu overlays a new element on the page? To see what I mean, go to his example. Hover over about, then move to each item on the menu. When you get to them (just below her), the menu disappears, presumably because the background paragraph under the menu is now being hovered over. I can't figure out why this is happening... __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Div positioning.. strange!
Augusto Murri a écrit : Hi all, i would like position the two layers (div#header_LEFT div#header_RIGHT) in just one row.. the page is http://www.opent.it/gasper/ I don't understand why i can't position it well... :( Anyone can help me?? Thx a lot!! __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ Hi Augusto, I think 2 /div are missing. try this: div a href=# title=Indeximg src=Gasper%20%5B%20CMS%20multicanale%20%5D_fichiers/logo_gasper.png with=88 alt=Gasper - Index id=logo height=93/a /div /div /div div id=header_RIGHT Cordialy, eric vesque __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Getting DIVs to adjust dynamically
Hi all, I've created 2 DIV tags that become visible or invisible based on what the user selected in a dropdown. If the us selects United States from the dropdown, then a DIV is displayed that contains form fields for a zip code search. Otherwise, the second DIV is enabled which simply displays a submit button. The problems that I'm having are: 1) I'm using absolute positioning to position the DIVs under the dropdown and center accordingly. This is an issue when the user resizes their browser. How can I make it so that the DIVs adjust dynamically? 2) The second issue is really more of a UI thing. When the user submits, the results are displayed fairly far down because of the space the DIVs take up. Is there a way to dynamically adjust the results up or down based on whether a DIV becomes visible? Here's the link: http://dev.tropicaltraditions.com/outlets.cfm Just click on I agree and it will take you to the page. Thanks for the help guys. Rey... __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] A hack for all Opera browsers ?
Hi all, Is there a hack that works in *every* version of Opera browsers ? Guillaume. Play: hablablow.com http://www.hablablow.com Talk: only-4u.org http://www.only-4u.org Work: webdesignofficina.com http://www.webdesignofficina.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] invalid: nesting a div inside a dt-- alternative?
Hello! The validator is not liking this: dtlabel for=projectdddressStreet Address:/label div class=helpIf known./div /dt ddinput type=text id=projectdddress name=projectdddress size=50 value= maxlength=1 //dd What is a good solution? I'd like to have: label (break) help text (break) input If i make the div for help a span, how would I style it to go to next line? I'm using a dl for the form because I've had success in the past with simpler forms using that method, but this one is a bit more complex. Should I bag the dl altogether and use a different method? Input requested. Thanks~! Lisa __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Print style sheet not working in Opera (8.5)
Ingo Chao wrote:
The bug: Opera8 takes the body-background-color of the /screen/ style
sheet for the preview/print -- and ignores the settings for the
body-background made in the print style sheet.
And Opera8 by default prints backgrounds. That means, the
background-color that was intended to the screen can be seen in the
print preview.
A fix is to set
html {background-color: #FFF;}
in the /screen/ style sheet.
This is a fix for overriding a background color set on the body,
correct, but there is no workaround for backgrounds on other elements,
like a container div? This is a ridiculous bug but not one I'm very
worried about, but I want to make sure I'm understanding you correctly.
Zoe
--
Zoe M. Gillenwater
Design Services Manager
UNC Highway Safety Research Center
http://www.hsrc.unc.edu
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] invalid: nesting a div inside a dt-- alternative?
On 20/10/05, Lisa Hoppes [EMAIL PROTECTED] wrote: ddinput type=text id=projectdddress name=projectdddress size=50 value= maxlength=1 //dd (...) What is a good solution? A form is not a definition list, guy... You shouldn't be using this way. The problem is not the tag that you'd use inside the dd, is what to do to replace the dd for a correct alternative, keeping the semantic code and valid. -- diego nunes __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] invalid: nesting a div inside a dt-- alternative?
If i make the div for help a span, how would I style it to go to next line? If you replace the div with a span, you could give it a display: block; and then treat it as you would a div. I'm not sure off the top of my head how this affects validity though. -- Peter J.Lambert home: http://pixelicious.co.uk email: [EMAIL PROTECTED] telephone: +44 (0)7789 882480 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Space below footer in Firefox and NE 7 (IE6 OK)
I am working on building a new site. This is my first site I'm trying to build completely in CSS. I have a white space appearing below my footer in Firefox and NE7, but it seems to be OK in IE6. Please see http://www.gwvirginia.gwu.edu/newsite/3coltest.htm. Code at: http://www.gwvirginia.gwu.edu/newsite/3coltest.css The big blue rectangle in the middle is just a space holder for an image(s). Thoughts on how to fix this? I am trying to create a 3-column layout using the technique at www.tjkdesign.com/articles/3cols.asp, but something seems to have gone wrong. Thanks for your help. I'm on the digest so cc'ing my direct e-mail would be great. Dova H. Wilson Marketing Communications Specialist George Washington University Virginia Campus 44983 Knoll Square, Rm. 305 Ashburn, Virginia 20147 Phone: 703-726-3652 Fax: 703-726-3655 www.gwvirginia.gwu.edu __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Jumping Suckerfish...
Hi. I'm using a margin in my anchor tags to achieve a transparant gap between list items. Unfortunately on IE6 list items with sub lists only render the margin when rolled over (when the sub list is displayed) resulting in a jumpy menu.. http://www.undiscoveredalps.com/test/test.php Any suggestions? Tekin __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] invalid: nesting a div inside a dt-- alternative?-- SOLVED
Thanks to Paul Debban, who suggested that I associate the help text with the input rather than the label. This validates: dtlabel for=projectdddressStreet Address:/label /dt dddiv class=helpIf known./divinput type=text id=projectdddress name=projectdddress size=50 value= maxlength=1 //dd Lisa On 10/20/05, Lisa Hoppes [EMAIL PROTECTED] wrote: The validator is not liking this: dtlabel for=projectdddressStreet Address:/label div class=helpIf known./div /dt ddinput type=text id=projectdddress name=projectdddress size=50 value= maxlength=1 //dd What is a good solution? I'd like to have: label (break) help text (break) input __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] invalid: nesting a div inside a dt-- alternative?
On Oct 20, 2005, at 10:12 AM, Lisa Hoppes wrote:
Should I bag the dl altogether and use a different method?
Yes, please. Tag the form elements properly and use CSS to style them
the way you need them is better than trying to fool the browser into
doing it by claiming they're something else.
Your message suggested you wanted the label, help text and input box
on different lines, with the input box indented a little. Styling all
three with display:block; will put them on separate lines, then
apply margin and padding to separate them the correct distance,
adding a little extra on the left side of the input box to slide it
in the way the definition list would is about all you'd need to
achieve the simplistic version of that. If your entire form was to be
structured that way, you could give the form an ID and put:
form#formID label { display: block;}
form#formID p { display: block;} /*yes this is redundant,
omit display placeholder and include the padding you want*/
form#formID input { display: block; padding-left: 10px;}
(add whatever extra margins and padding you want) or something
similar in the CSS file and you're done.
http://www.wpdfd.com/editorial/basics/cssbasics13.html
is a good starting point for designing forms.
Have Fun,
Arlen
--
In God we trust, all others must supply data
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Pre-wrap and hanging indent?
Rodent of Unusual Size wrote: I want to display an IRC conversation log fragment in an HTML pre element. I want the effect of white-space: pre-wrap, so that text on each line that's too wide will wrap. However, when that happens I want the wrapped text to be indented, so that it'll be clear that it's a continuation. I could probably get the effect I want by putting each line into an appropriately-styled p element or the like, but that's awkward. Is there any way to set a hanging indent on 'pre-wrap' text like this? Sort of treating each line from start to hard newline as an implicit block element? ROUS, You can create a hanging indent effect by using a negative text-indent value. That pulls the first line off to the left, creating the appearance that all subsequent lines are indented. However, this is dependent on each piece of text to be wrapped in some sort of container that you apply the text-indent to -- there's no such thing as an implicit block element as you mention. Either you've told the browser how to group the content, or you haven't. If you just have all the pieces of text plopped in a pre element, you wouldn't have anything to apply the text-indent property to. I suppose you could wrap each piece of text in its own pre element, rather than just have one pre element for the entire conversation? Zoe -- Zoe M. Gillenwater Design Services Manager UNC Highway Safety Research Center http://www.hsrc.unc.edu __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] 3 Col Liquid Equal Heights that works?
Eatme wrote: here is one with liquid left and right columns, but it also breaks in IE 5.2 Mac http://www.tjkdesign.com/articles/liquid/8.asp Are you sure? I can test this layout here on IE5.0 (OS9) and IE5.2 (OSX - 2 different machines) and it works fine. Browsercam doesn't report anything wrong either... Thierry | www.TJKDesign.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] A hack for all Opera browsers ?
Guillaume wrote:
Hi all,
Is there a hack that works in *every* version of Opera browsers ?
Guillaume.
Not that I know of. But there is 'be even nicer to Opera' (7.23+, I
think-- and don't forget to mind the final brace)
@media screen and (min-width: 0px){
#foo { padding: 2px 10px 2px 4px;}
}
Regards,
~dL
--
David Laakso
http://www.dlaakso.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] 3 Col Liquid Equal Heights that works?
Eatme wrote: I have been looking for the following layout solution for the past 24hrs: 3 column liquid with header and footer ideally right and left are fixed width, but I may try liquid if it meets the other criteria middle content column comes first any column can be longest the layout does not need to support 4.0 browsers, but should support all other major browsers. Ideally the layout would: not use javascript keep hacks to a minimum examples that i have found, but break in a few browsers: this one breaks in IE 5.2 Mac (maybe others) http://www.pmob.co.uk/temp/3colfixedtest_sourcenone.htm here is one with liquid left and right columns, but it also breaks in IE 5.2 Mac http://www.tjkdesign.com/articles/liquid/8.asp If the layout breaks only in 5.2 it may have more to do with a software rendering peculiarity of *your* CSS rather than that of the layout proper. Mac/iE5.2 has a number of peculiar problems in and of itself. This is a helpful reference for 5.2. http://www.l-c-n.com/IE5tests/ Regards, ~dL __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ -- David Laakso http://www.dlaakso.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Weird bug could use some help with
Ingo,
Thanks for your help, You are a Godsend! This solved the problem and has
everything working beautifully.
*** New Phone Number -- 315.268.6713***
*** New Office Location -- Science Center 305 ***
Julie M. Davis
Web/Graphic Designer
-
Clarkson University
PO Box 5535
Potsdam, NY 13699-5535
315.268.6713
-
[EMAIL PROTECTED]
www.clarkson.edu
Ingo Chao [EMAIL PROTECTED] wrote on 10/20/2005 05:35:25 AM:
Julie Davis wrote:
...
http://www.clarkson.
edu/getting_into_clarkson/calendar/off_campus_interview.php
and some random others on the site using IE randomly the sub
navigation
will jump out of the layout and off to the left of the page. If you
refresh the page it will go back but sometimes it does not. ...
Julie,
I cannot reproduce the problem of your life page on a local copy, so the
following is a guess.
The jpg you provided looks like as if div.leftcontent as a whole is
misplaced. This might be a result of the position:relative bug in IE you
are using to fix the peekaboo. The parent of this container is
relatively positioned too.
div id=leftcontent2.../div
div id=rightcontent2
div class=leftcontent .../div
/div
#leftcontent2 {
float:left;
width:246px;
...}
#rightcontent2 {
margin-left: 246px;
position: relative;
...}
#rightcontent2 div.leftcontent {
float: left;
position: relative;
...}
You may try to add
#rightcontent2 {zoom:1;}
to test if haslayout will stabilize the container [1].
(later, I would test if both the p.r. are still needed?)
By adding layout to the #rightcontent2, it will show a 3px text jog bug
[2].
The fix is to reduce the margin-left of
#rightcontent2 { margin-left: 243px; }
by 3px and to make room on the right side of the float:
#leftcontent2 {margin-right:-3px;)
Once all is running well for IE, you should move these hacks in a
separate iefix.css via conditional comments [3], as they say that the
- three px jog bug
- peekaboo bug
- position:relative bug
you are experiencing would be fixed in IE7. And they say we shall not
hack anymore. We'll see.
Ingo
[1] http://www.satzansatz.de/cssd/onhavinglayout.html#rp
[2] http://positioniseverything.net/explorer/threepxtest.html
[3] http://www.satzansatz.de/cssd/onhavinglayout.html#hack
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Print style sheet not working in Opera (8.5)
Zoe M. Gillenwater wrote:
This is a fix for overriding a background color set on the body,
correct, but there is no workaround for backgrounds on other elements,
like a container div? This is a ridiculous bug but not one I'm very
worried about, but I want to make sure I'm understanding you correctly.
Zoe, I don't think that normal divs are affected by the bug. Its the
body and html bg-color, when I am not wrong.
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html
head
meta http-equiv=Content-Type content=text/html; charset=UTF-8
title/title
style type=text/css
@media screen {
/* switch */
/* html {background-color: maroon;} */
body {background-color: red;}
div#bg {background-color: blue}
}
@media print {
body {
background: olive;
border: 5px solid fuchsia;
}
html {background: yellow;}
}
}
/style
/head
body
div id=bgHello/div
divWorld/div
/body
/html
Compared with Firefox set to print backgrounds, Opera does it wrong.
In print preview,
- the screen-body-bg overwrites the print-html-bg and the print-body-bg
But if the screen-html-bg is set,
- the print-body-bg is respected, but not the print-html-bg
Sorry, this is beyond my understanding. Better try for yourself, maybe
I'm overlooking the obvious. The bug is reported [1] a while ago.
A version of our haslayout-article was white font on dark gray
background, resulting in a cool, but somewhat inaccessible print effect
(black font on dark gray) -- by default in OP8 PC/Mac.
We played with the order of the style sheets and with !important with no
avail.
So we came up with this fix, alternatively, one could set an explicit
white background for a pagewrapper in the print style sheet.
Ingo
[1] http://my.opera.com/community/forums/topic.dml?id=87971
--
http://www.satzansatz.de/css.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] 3 Col Liquid Equal Heights that works?
On Oct 20, 2005, at 1:20 PM, Ford, Janet wrote: I don't remember if this breaks or not in IE5.2 : http://www.worqx.com/pv7/project7.htm but I think it was okay. The middle column in that layout does not come first. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] text not wrapping around floating div in IE
Hello, on the personal site that I am working on (http://www.inspired-evolution.com/About_Me.php), in IE the paragraph text is dropping below the right floated div (suggested links), (see mozilla, firefox for intended look). I was hoping for some suggestions to achieve the same effect in IE as in FF, without changing the CSS for the paragraph text. That is. change the right floated div (#box) instead of the #main_content p stuff. One way I know of is wrapp the text in a div and float left for IE, but this would be a major pain. Any other suggestions? full CSS is at http://www.inspired-evolution.com/Gilbert.css TIA -Bruce -- ::Bruce:: __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
