[css-d] forms - text baselines vertical grids
I would like to hear your suggestions comments on the following way of styling forms. My aim was to keep all elements in a row aligned to the text baseline and to create a vertical grid by controlling the row height. (The light blue line shows the alignment to the text baseline.) My test case shows one row with two labeled form fields (tested in FF and IE8): http://jsfiddle.net/cizmazia/KMVmw/77/ vertical-align: baseline - (default) aligns all elements vertically according to the text baseline border: 1px - triggers different rendering of the input select elements when they have the same implicit height box-sizing: border-box; - allows to set the same width of the input select elements As the input select elements are rendered differently, I have not found a consistent way how to set the same explicit height of the input select elements while keeping them aligned to the text baseline. Therefore I wrap them and set a sufficiently big height to the wrappers. I look forward to hearing your suggestions comments. Michal Cizmazia __ css-discuss [cs...@lists.css-discuss.org] 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] Why won't this table style nicely in IE?
I am at my wits end with Internet Explorer. I have a calendar widget (javascript) on a contact form which just refuses to style. It looks fine in Chrome/Firefox, etc (of course), but I just can't get it right in IE, and I've been struggling for hours now. http://www.exclusivevillas.co.za/contact-us/ (Click any of Check in date or Check out date) Here is a screenshot of how they look in Chrome and IE 8: http://www.exclusivevillas.co.za/wp-content/uploads/screenshot.jpg Thanks in advance Amanda __ css-discuss [cs...@lists.css-discuss.org] 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] selected link colour problem
Ok, this has me completely stumped. I have a menu list as follows: div id=sidemainmenu ul lia href=../index.html view-source:http://www.diabetespolarflight.org/index.htmlHome/a/li lia href=donations.html view-source:http://www.diabetespolarflight.org/xhtml/donations.htmlDonations/a/li lia href=bios.html view-source:http://www.diabetespolarflight.org/xhtml/bios.htmlBiographies/a/li lia href=press.html view-source:http://www.diabetespolarflight.org/xhtml/press.htmlPress/a/li lia href=thanks.html view-source:http://www.diabetespolarflight.org/xhtml/thanks.htmlclass=currentpagestrongThanks/strong/a/li lia href=# view-source:http://www.diabetespolarflight.org/xhtml/thanks.html#class=currentpagestrongThanks/strong/a/li /ul /div The selected link, say for example the thanks page needs to be a red colour. This is achieved using the class #sidemainmenu .currentpage. If the link is just a hash sign the styling works. Once i add a correct href to an actual file it won't honour the red colour. Why the hell is that? css here:http://www.diabetespolarflight.org/css/mainstyles.css page here:http://www.diabetespolarflight.org/xhtml/thanks.html Thanks Lisa __ css-discuss [cs...@lists.css-discuss.org] 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] Son of Suckerfish problems
__
El 09/11/2010, a las 21:11, Daniel Hammond escribió:
URL: http://www.numcchildren.org/new/index.html
CSS: http://numcchildren.org/new/children.css
Browsers that display the site correctly:
Firefox, Opera, IE8
Browsers that have problems:
Safari, Chrome, IE8 in compatibility view
I’m trying to use the son of suckerfish method for the drop-down
navigation.
In IE8 compatibility view, the sub-menus appear to the right of their
parents, rather than underneath them. In Safari and Chrome, the sub-
menu
items don’t change color when hovered over, but they’re supposed to.
Test
the site in the latest versions of FF, Opera, or IE8 to see the site
functioning properly.
I just adapted a Son of Suckerfish menu for a site and have had no
problems with any browser PC or Mac, except of course having to make a
couple of special styles for (spit, spit) IE. You may have to position
the dropdowns differently for IE to make them appear where you want.
But I had no problem with the hover colour change on the main and
submenus - both work OK.
Possibly, maybe, no guarantees, where you have:
#nav ul ul li a:hover, #nav ul ul li a:active {
display: block;
background: #93c83d;
padding: 10px;
in your css, it would work better with:
#nav li ul li a:hover
Hope this turns out to be useful, Peter H.
__
css-discuss [cs...@lists.css-discuss.org]
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] XHTML or not?
I am relatively inexperienced with CSS and HTML..I've made all my own web pages, but learn what I need at the time followed by years of doing nothing with it until the next re-design. A tutorial I watched recommended going with XHTML, but some say it's not the way to go, and I don't know for sure what the right direction would be for me. Recommendations? thanks! John __ css-discuss [cs...@lists.css-discuss.org] 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] selected link colour problem
Lisa, Your selector: #sidemainmenu a:visited is stronger than: #sidemainmenu .currentpage You could bump the strength of your .currentpage selector like so (there are other ways as well): #sidemainmenu a.currentpage Cheers, Shawn On 11/10/2010 7:53 AM, Lisa Frost wrote: Ok, this has me completely stumped. I have a menu list as follows: div id=sidemainmenu ul lia href=../index.html view-source:http://www.diabetespolarflight.org/index.htmlHome/a/li lia href=donations.html view-source:http://www.diabetespolarflight.org/xhtml/donations.htmlDonations/a/li lia href=bios.html view-source:http://www.diabetespolarflight.org/xhtml/bios.htmlBiographies/a/li lia href=press.html view-source:http://www.diabetespolarflight.org/xhtml/press.htmlPress/a/li lia href=thanks.html view-source:http://www.diabetespolarflight.org/xhtml/thanks.htmlclass=currentpagestrongThanks/strong/a/li lia href=#view-source:http://www.diabetespolarflight.org/xhtml/thanks.html#class=currentpagestrongThanks/strong/a/li /ul /div The selected link, say for example the thanks page needs to be a red colour. This is achieved using the class #sidemainmenu .currentpage. If the link is just a hash sign the styling works. Once i add a correct href to an actual file it won't honour the red colour. Why the hell is that? css here:http://www.diabetespolarflight.org/css/mainstyles.css page here:http://www.diabetespolarflight.org/xhtml/thanks.html Thanks Lisa __ css-discuss [cs...@lists.css-discuss.org] 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-discuss [cs...@lists.css-discuss.org] 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] XHTML or not?
On Wed, Nov 10, 2010 at 12:49 PM, John j...@coffeeonmars.com wrote: I am relatively inexperienced with CSS and HTML..I've made all my own web pages, but learn what I need at the time followed by years of doing nothing with it until the next re-design. A tutorial I watched recommended going with XHTML, but some say it's not the way to go, and I don't know for sure what the right direction would be for me. Recommendations? thanks! John HTML vs. XHTML is off topic for css-discuss. You should try the web design list: http://lmgtfy.com/?q=%5Bwd%5D+listl=1 See also: http://css-discuss.incutio.com/wiki/Off_Topic Places where it would be appropriate to discuss such things and ask questions about them:- -- - tim.arn...@gmail.com __ css-discuss [cs...@lists.css-discuss.org] 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] XHTML or not?
On 10.11.2010 18:49, John wrote: [...] Recommendations? The syntax for both HTML 4.1 and XHTML 1.0 works when transferring/converting to HTML 5, so just choose the variant you like the most, and stick with it. Remember to make/write your choice Strict, logical and valid all the way all the time, as that makes CSS styling and subsequent troubleshooting so much easier. regards Georg __ css-discuss [cs...@lists.css-discuss.org] 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] XHTML or not?
Ar 10/11/10 17:49, ysgrifennodd John : I am relatively inexperienced with CSS and HTML..I've made all my own web pages, but learn what I need at the time followed by years of doing nothing with it until the next re-design. A tutorial I watched recommended going with XHTML, but some say it's not the way to go, and I don't know for sure what the right direction would be for me. Recommendations? thanks! John Hi John, Was there any particular reason why XHTML would not be the way to go? Whatever DOCTYPE you decide to use, you have to follow its rules and - speaking personally - I've never found following the rules of XHTML to be any more onerous than those of HTML. Unless I really have no choice (e.g. a customer wants to force the opening of a new window from a link) all my stuff is XHTML 1.0 Strict and CSS 2.1. There are a couple of things you have to bear in mind if you want XHTML to work in older IEs, like omitting the XML declaration and not using XHTML 1.1 (both of which put IE into quirks mode, IIRC), but working with older IEs is going to be a problem whatever DOCTYPE you choose. XHTML might make it a bit easier to ensure the separation of structure and format, I suppose; but good practise should make you do that anyway. But at the end of the day - and in my opinion only - it's just a matter of choice. It's producing *valid* HTML that's important to me, not the DOCTYPE. HTH Cheers Peter -- http://www.peredur.net __ css-discuss [cs...@lists.css-discuss.org] 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] XHTML or not?
Hi John. Using XHTML today's like riding a dead horse. XHTML will no longer be developed, at least in a reasonable time span. The fact is that XHTML was designed to be served as application/xhtml+xml in order to make it interact with other markup languages, such as SVG, MathML and SMIL. The problem is that IE doesn't support this mime type. The latest update from MS claims that IE9 will support it, but without checking if a document is well-formed or not. That is, MS seems to ignore even the most basic rule of XML. So, if you want my little piece of advice, start getting used to HTML5. I'm not saying that you should use all its elements, but only to take the habit of writing HTML5 documents. You'll find out that HTML5 is really like HTML4, but with a lot of improvements. bye :-) Gabriele Romanato http://www.css-zibaldone.com http://www.css-zibaldone.com/test/ (English) http://www.css-zibaldone.com/articles/ (English) http://onwebdev.blogspot.com/ (English) __ css-discuss [cs...@lists.css-discuss.org] 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] selected link colour problem
On Thu, Nov 11, 2010 at 1:04 AM, Shawn Lawler lawl0...@umn.edu wrote: Lisa, Your selector: #sidemainmenu a:visited is stronger than: #sidemainmenu .currentpage You could bump the strength of your .currentpage selector like so (there are other ways as well): #sidemainmenu a.currentpage Cheers, Shawn doh, knew it would be something simple. Won't forget that one in a hurry again. __ css-discuss [cs...@lists.css-discuss.org] 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] Is this dumb?
Hi all, I've been working on this layout: (w/screenshots from browsershots) http://www.dmcentral.net/misc and I can't figure out why in IE 8 the whole body shifts to the left about 5 pixels and cuts some of the left side off according to browserlab. In IE 7 according to browserlab the body shifts even more to the left than IE8 and also shifts the top bar to the right making it flush with the wrapper. and in IE 6 with browserlab I get a completly blank page. Finally, with browsershots, IE7 looks correct except the top bar is still shifted to the right. In IE8 I got a completly blank page and in IE6 I get the same behavior as IE 7. Finally my question. Is there a reason I'm getting this odd behavior with the screenshot services and I've also been wondering if this is a dumb way to do this. It dawned on me I could go with a 4 column layout, but the drawback is in order to get the image at the top to span the whole screen, I'd have to add it to each of the 4 div's. to me it seems unnecessary. 2nd finally ;-) I can't figure out why this simple layout isn't working. -- Blessings David M. __ css-discuss [cs...@lists.css-discuss.org] 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] Internal site links handled in print style sheet
I'm using this CSS ...
a[href^=http://]:after {
content: (online at: attr(href));
}
...to handle links to external sites when a visitor prints one of my
pages. However, I occasionally refer to related pages within my own
site/file directory. Not sure how to handle these links in the print.css
style sheet.
- Keith Purtell
__
css-discuss [cs...@lists.css-discuss.org]
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] Is this dumb?
On Wednesday, November 10, 2010 08:00:24 pm David Laakso wrote: On 11/10/10 7:34 PM, David McGlone wrote: 2nd finally ;-) I can't figure out why this simple layout isn't working. Cut to the chase. Put the html/css file [s] on a public server and provide a clickable link to it in your post. LOL I got chewed out for asking this same question and was told to look at the source, so I assumed everybody did it this way. sorry about that. here ya go http://www.dmcentral.net/include/style/default.css -- Blessings David M. __ css-discuss [cs...@lists.css-discuss.org] 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] Is this dumb?
On 11/10/10 7:34 PM, David McGlone wrote: 2nd finally ;-) I can't figure out why this simple layout isn't working. Cut to the chase. Put the html/css file [s] on a public server and provide a clickable link to it in your post. Thanks. ~d -- :: desktop and mobile :: http://chelseacreekstudio.com/ __ css-discuss [cs...@lists.css-discuss.org] 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] Is this dumb?
On Wednesday, November 10, 2010 08:12:59 pm David McGlone wrote: On Wednesday, November 10, 2010 08:00:24 pm David Laakso wrote: On 11/10/10 7:34 PM, David McGlone wrote: 2nd finally ;-) I can't figure out why this simple layout isn't working. Cut to the chase. Put the html/css file [s] on a public server and provide a clickable link to it in your post. LOL I got chewed out for asking this same question and was told to look at the source, so I assumed everybody did it this way. sorry about that. here ya go http://www.dmcentral.net/include/style/default.css Oh jz this isn't my night!! http://www.dmcentral.net/misc/include/style/default.css I need a vacation!!! -- Blessings David M. __ css-discuss [cs...@lists.css-discuss.org] 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] Is this dumb? UPDATE
On Wednesday, November 10, 2010 07:34:11 pm David McGlone wrote: Hi all, I've been working on this layout: (w/screenshots from browsershots) http://www.dmcentral.net/misc and I can't figure out why in IE 8 the whole body shifts to the left about 5 pixels and cuts some of the left side off according to browserlab. In IE 7 according to browserlab the body shifts even more to the left than IE8 and also shifts the top bar to the right making it flush with the wrapper. and in IE 6 with browserlab I get a completly blank page. Finally, with browsershots, IE7 looks correct except the top bar is still shifted to the right. In IE8 I got a completly blank page and in IE6 I get the same behavior as IE 7. Finally my question. Is there a reason I'm getting this odd behavior with the screenshot services and I've also been wondering if this is a dumb way to do this. It dawned on me I could go with a 4 column layout, but the drawback is in order to get the image at the top to span the whole screen, I'd have to add it to each of the 4 div's. to me it seems unnecessary. 2nd finally ;-) I can't figure out why this simple layout isn't working. After I sent this e-mail, I used browserlab and checked the layout that I had uploaded to my website and I am getting the correct behavior in IE 7 and IE 8, but still getting a blank page with IE 6. :-( I have no idea why my local copy looks like crap. It may have something to do with me switching from cable internet to DSL today. -- Blessings David M. __ css-discuss [cs...@lists.css-discuss.org] 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] Is this dumb? UPDATE
On Wednesday, November 10, 2010 07:55:43 pm David McGlone wrote: On Wednesday, November 10, 2010 07:34:11 pm David McGlone wrote: Hi all, I've been working on this layout: (w/screenshots from browsershots) http://www.dmcentral.net/misc and I can't figure out why in IE 8 the whole body shifts to the left about 5 pixels and cuts some of the left side off according to browserlab. In IE 7 according to browserlab the body shifts even more to the left than IE8 and also shifts the top bar to the right making it flush with the wrapper. and in IE 6 with browserlab I get a completly blank page. Finally, with browsershots, IE7 looks correct except the top bar is still shifted to the right. In IE8 I got a completly blank page and in IE6 I get the same behavior as IE 7. Finally my question. Is there a reason I'm getting this odd behavior with the screenshot services and I've also been wondering if this is a dumb way to do this. It dawned on me I could go with a 4 column layout, but the drawback is in order to get the image at the top to span the whole screen, I'd have to add it to each of the 4 div's. to me it seems unnecessary. 2nd finally ;-) I can't figure out why this simple layout isn't working. After I sent this e-mail, I used browserlab and checked the layout that I had uploaded to my website and I am getting the correct behavior in IE 7 and IE 8, but still getting a blank page with IE 6. :-( I have no idea why my local copy looks like crap. It may have something to do with me switching from cable internet to DSL today. This wasn't the case. I hooked up my cable because they haven't turned it off yet and I'm getting the same results. -- Blessings David M. __ css-discuss [cs...@lists.css-discuss.org] 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] Spries
Hello, In Dreamweaver (Live View), the spry looks exactly as I want it to look. When I upload the file and the Spry assets to the server, the webpage displays in the browser as a list instead of the cool spry. See at: http://138.26.120.126/CAMAC/Trial21.html Could you help? Thanks. Ada __ css-discuss [cs...@lists.css-discuss.org] 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] Spries
Your css file is here: http://138.26.120.126/CAMAC/SpryAssets/SpryMenuBarVertical.css But you link to: http://138.26.120.126/SpryAssets/SpryMenuBarVertical.css via link href=../SpryAssets/SpryMenuBarVertical.css rel=stylesheet type=text/css / Try: link href=/CAMAC/SpryAssets/SpryMenuBarVertical.css rel=stylesheet type=text/css / -- Regards, Thierry www.tjkdesign.com | www.ez-css.org | @thierrykoblentz -Original Message- From: css-d-boun...@lists.css-discuss.org [mailto:css-d- boun...@lists.css-discuss.org] On Behalf Of Ada Elgavish Sent: Wednesday, November 10, 2010 6:33 PM To: David Laakso; css-d@lists.css-discuss.org Subject: [css-d] Spries Hello, In Dreamweaver (Live View), the spry looks exactly as I want it to look. When I upload the file and the Spry assets to the server, the webpage displays in the browser as a list instead of the cool spry. See at: http://138.26.120.126/CAMAC/Trial21.html Could you help? Thanks. Ada __ css-discuss [cs...@lists.css-discuss.org] 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-discuss [cs...@lists.css-discuss.org] 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/
