Re: [css-d] IE bug - Submit and Reset
Iorhael wrote: When I click submit on this form, the space above the Submit and Reset buttons disappears in IE. It doesn't effect the function but it looks ugly. Does anyone know of a fix for this? http://www.drkdesign.com/debscards/cards_form.php Have you tried applying layout to .center, e.g. a width? Ingo -- http://www.satzansatz.de/css.html __ 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] Image transparency overlay
I am having trouble having my images light up on mouseovers. I am currently using the css3 opacity property In which browser are you experiencing problems? In a similar problem I reverted to an extra stylesheet for IE/Win, which relies on Microsoft-proprietary Alpha-filters. http://msdn.microsoft.com/workshop/author/filter/reference/filters/ alpha.asp Regards Mark Howells www.permanenttourist.ch __ 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 Mac float problem
Hi Roger, In ie/mac floats without widths take up 100% of available width. Give a width to #hdrleft and things will likely work better. Thanks, useful to know, but doesn't seem to have made any difference in this instance. Any more ideas? -- Cheers, Julian Voelcker Cirencester, United Kingdom __ 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 Mac float problem
Julian Voelcker wrote:
In IE the main layers aren't floating properly, resulting in them
appearing staggered on the page.
http://asummerhouse.tvw.net
your code
#header { border: 0pt none ; position: relative; clear: both; }
#bodyblock { position: relative; clear: both; width: 760px; }
clear is incorrectly inherited by the child elements, see
http://www.l-c-n.com/IE5tests/float2misc/#fm002
Ingo
--
http://www.satzansatz.de/css.html
__
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] Width Handling IE/Win
Hi Guys I have double check my maths and still come up with a problem in IE/Win. The site is at: http://www.lostwithiel.org.uk/ http://lostwithiel.org.uk/wp-content/themes/Lostwithiel/style.css In IE/Win the sidebar floats below the main content. I am using a flexible width layout inspired by Dan Cederholm. I think it is probably the padding thing but it might be a bug. Can anybody help please? Thanks. -- Rich http://www.cregy.co.uk Embracing what God does for you is the best thing you can do for him. Romans 12 v 1 __ 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] CSS validators?
I'm interested in either getting hold of a standalone tool that validates CSS files, or in building my own. I'd like to automate CSS validation as part of a build process, so I'm not interested in interactive or IDE-type tools, and web-based services such as the W3C's validator are out of question. Does anyone have any experience with such tools? Cecil Ward. __ 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] Width Handling IE/Win
Richard Brown wrote:
http://www.lostwithiel.org.uk/
In IE/Win the sidebar floats below the main content.
#sidebar { float: right; width: 27%; margin-left: 3%; }
Do you need this left margin at all?
(IE will not calculate this % margin correctly for various reasons [1]
the % margin is calculated with respect to its grandparent, body, and
not as intended with respect to #wrap. You would need an #innerwrapper
of 100% width of #wrap, but rounding problems would still remain).
Some other problems on this page could be related to the doubled float
margin bug [2], I suspect, and in addition, various rounding problems in IE.
The horizontal scroll bar in all browswers is due to the ul navigation
#nav {...width: 100%;... padding: 10px 0 0 46px;}
see the css-d WIKI for the CSS box model.
Ingo
[1] http://positioniseverything.net/explorer/percentages.html
[2] http://positioniseverything.net/explorer/doubled-margin.html
--
http://www.satzansatz.de/css.html
__
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] Width Handling IE/Win
Richard Brown wrote: Hi Guys I have double check my maths and still come up with a problem in IE/Win. The site is at: http://www.lostwithiel.org.uk/ http://lostwithiel.org.uk/wp-content/themes/Lostwithiel/style.css In IE/Win the sidebar floats below the main content. I am using a flexible width layout inspired by Dan Cederholm. I think it is probably the padding thing but it might be a bug. Can anybody help please? Thanks. Ingo has answered your question regarding ie. In all my browsers in linux (debian) your /home/ page is getting cross-over at 800 1024; and at 1280 with zoom. It /may/ be related to the markup errors on that page? See: http://dlaakso.com/rb.jpg ~davidLaakso ps font-size 'small' on the body is not bullet-proof(why in the world did that man ever name that book that in this day and age?). __ 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] CSS validators?
Cecil, On Feb 17, 2006, at 6:21 AM, Cecil Ward wrote: I'm interested in either getting hold of a standalone tool that validates CSS files, or in building my own. I'd like to automate CSS validation as part of a build process, so I'm not interested in interactive or IDE-type tools, and web-based services such as the W3C's validator are out of question. The w3 css validator can be downloaded and installed locally. http://jigsaw.w3.org/css-validator/DOWNLOAD.html I haven't yet done so, so I can't comment on how easy/hard it is. hth -- Roger Roelofs Remember, if you’re headed in the wrong direction, God allows U-turns! ~Allison Gappa Bottke __ 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] Difficulty with CSS image rollovers
I have a page with image map-based rollovers, and I have resorted to
using Dreamweaver's built-in, JavaScript-based rollovers, because I
can't get them to work using CSS in IE6. Both a Dreamweaver and a CSS
version of the page are on the web:
Dreamweaver:
http://wolohan.com/pages_01/pfsStocking.php
CSS that breaks in IE6:
http://wolohan.com/pages_01/pfsStocking2.php
I thought that an .htc file might fix it, but that did not work. I've
never used .htc files before, I tried using whatever:hover, and another
one from www.howtocreate.co.uk, with no luck.
Here's what I think is the relevant CSS:
body {
behavior:url(../js/csshover.htc);
}
div#pfs01 { position:absolute; left:182px; top:6px; z-index:1 }
div#pfs02 { position:absolute; left:237px; top:13px; z-index:2 }
...etc. through 17
div#pfs01, div#pfs02, div#pfs03, div#pfs04, div#pfs05, div#pfs06,
div#pfs07, div#pfs08, div#pfs09, div#pfs10, div#pfs11, div#pfs12,
div#pfs13, div#pfs14, div#pfs15, div#pfs16, div#pfs17
{
width: 45px;
height: 45px;
}
div#pfs01 a span, div#pfs02 a span, div#pfs03 a span, div#pfs04 a span,
div#pfs05 a span, div#pfs06 a span, div#pfs07 a span, div#pfs08 a span,
div#pfs09 a span, div#pfs10 a span, div#pfs11 a span, div#pfs12 a span,
div#pfs13 a span, div#pfs14 a span, div#pfs15 a span, div#pfs16 a span,
div#pfs17 a span
{
visibility: hidden;
text-align: center;
font: 10px/12px Arial, Helvetica, sans-serif;
}
div#pfs01 img, div#pfs02 img, div#pfs03 img, div#pfs04 img, div#pfs05
img, div#pfs06 img, div#pfs07 img, div#pfs08 img, div#pfs09 img,
div#pfs10 img, div#pfs11 img, div#pfs12 img, div#pfs13 img, div#pfs14
img, div#pfs15 img, div#pfs16 img, div#pfs17 img
{
height: 0; width: 0; border-width: 0;
visibility: visible;
height: 140px; width: 228px;
margin-left: -500px;
border: 0px solid white;*/
}
div#pfs01 a:hover img
{
position: absolute;
top: 0;
left: 0;
margin-left: -79px;
margin-top: 94px;
visibility: visible;
height: 140px; width: 228px;
}
...etc., through 17
I have something on the web that functions. Even so, I'd like to use a
CSS version if at all possible, and would appreciate any help.
---
[This E-mail scanned for viruses by Declude Virus]
__
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] CSS Media
Quick question for you all: When a browser is loading a page (ie. where media=screen), does a browser load/cache alternate stylesheets that are additionally declared in the page like so? link rel=stylesheet type=text/css href=/css/print.css media=print / Thanks! __ 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] problem with images in a print stylesheet
I love the valuable advice here, so here I go again... I am creating a print stylesheet for our website at work and so far things are going great except for one problem that I'm not sure how to fix. I'm using a float: left; or float: right; for images (brought in through 2 different classes) within our body text which looks great on screen, but it doesn't translate to print. The image appears and then the text breaks to the next line. Is there a way to change the style for these image classes in the print stylesheet so that the image prints with the text wrapping around it as it appears on screen? __ 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] problem with images in a print stylesheet
Poyner, Matt wrote: I love the valuable advice here, so here I go again... I am creating a print stylesheet for our website at work and so far things are going great except for one problem that I'm not sure how to fix. I'm using a float: left; or float: right; for images (brought in through 2 different classes) within our body text which looks great on screen, but it doesn't translate to print. The image appears and then the text breaks to the next line. Is there a way to change the style for these image classes in the print stylesheet so that the image prints with the text wrapping around it as it appears on screen? Have you tried what happens if you make the apply the screen stylesheet for print (just temporarily for testing)? If it works correctly, the problem lies in lack of styles or maybe errors in your print stylesheet. If not, the only thing I can think of without seeing the actual page, is lack of set widths on the floats perhaps. -- Els http://locusmeus.com/ http://locusoptimus.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] Another question about print stylesheet
I am wondering if, rather than telling the print stylesheet not to print most of the elements on the page, can I instead tell to only print one specific element. The reason I ask is this: currently, my boss's have decided not to go with an all-CSS based layout [rolls eyes]. So, within my page I have table layout. I'd like to strip all of that out and print only what is between my opening and closing div tags for #MainBodyContent. This way, my text will flow to fill the entire printed pages width. It's being restricted by the table layout currently and only filling about ¾ of the page 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/
Re: [css-d] Another question about print stylesheet
Poyner, Matt wrote: I am wondering if, rather than telling the print stylesheet not to print most of the elements on the page, can I instead tell to only print one specific element. No, without styles it would print everything, so you'd have to set display:none; for all the elements you don't want printed. The reason I ask is this: currently, my boss's have decided not to go with an all-CSS based layout [rolls eyes]. So, within my page I have table layout. I'd like to strip all of that out and print only what is between my opening and closing div tags for #MainBodyContent. That won't work; as soon as you set display:none for the table, it goes for all child elements inside. This way, my text will flow to fill the entire printed pages width. It's being restricted by the table layout currently and only filling about ¾ of the page width. You can however, set a different width on the table in the print stylesheet. Another option is to make two pages, one for print, and make a print-friendly link on the screen version. -- Els http://locusmeus.com/ http://locusoptimus.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/
Re: [css-d] Another question about print stylesheet #26
Matt,
One thing you can try:
assign div class=noprint/div to the elements you do not want to
print, where .noprint{display:none;} or .noprint{visibility:hidden}
(each does something slightly different).
Write the .noprint class into your print stylesheet. It should render
the elements it is applied to invisible upon printing. I use it to
eliminate our breadcrumb navigation links from the printed page.
-Chris
--
Message: 26
Date: Fri, 17 Feb 2006 13:26:49 -0500
From: Poyner, Matt [EMAIL PROTECTED]
Subject: [css-d] Another question about print stylesheet
To: css-d@lists.css-discuss.org
Message-ID:
[EMAIL PROTECTED]
Content-Type: text/plain; charset=iso-8859-1
I am wondering if, rather than telling the print stylesheet not to print
most of the elements on the page, can I instead tell to only print one
specific element.
The reason I ask is this: currently, my boss's have decided not to go
with an all-CSS based layout [rolls eyes]. So, within my page I have
table layout. I'd like to strip all of that out and print only what is
between my opening and closing div tags for #MainBodyContent.
This way, my text will flow to fill the entire printed pages width. It's
being restricted by the table layout currently and only filling about ?
of the page 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/
End of css-d Digest, Vol 39, Issue 42
*
__
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 Mac float problem
Hi Ingo,
your code
#header { border: 0pt none ; position: relative; clear: both; }
#bodyblock { position: relative; clear: both; width: 760px; }
clear is incorrectly inherited by the child elements, see
http://www.l-c-n.com/IE5tests/float2misc/#fm002
Thanks, I'll give it a try.
--
Cheers,
Julian Voelcker
Cirencester, United Kingdom
__
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] Does this layout work beyond Win IE/FF/Moz ... ?
hello, i have a development page at http://www.littlered.com/clients/blueseventy/production/. i hand-coded all the css and the layout so i could really get a grasp of all the stupidities of IE, but now i don't know if my display works in Mac in particular since all i have is a windoze machine. the layout *should* basically look like: http://www.littlered.com/clients/blueseventy/mocks/homepage_r2.html (there's a click to read more section that i use some cheap js to change the class of the wrapper id from display: none to display: block that hangs off the main wrapper. weirdness that was specifically requested... ) thanks for any feedback. cheers, rebecca. __ 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] Absolute newbie needs help with browser differences
Hi Folks, Please excuse me if this is in the archives, but I couldn't find anything that helped. I have two problems with positioning on this site: 1. The top navbar. I can't seem to get it to align (to the left edge of the #main box) in IE. After much experimentation (frustration), I got it to display the way it's intended in Firefox and Opera, but not IE. If I make adjustments for one browser (to the ul#topnav selector), it mucks up the other. Any ideas how to make all three work the same way? 2. The right-side image. I'm having similar issues with the top alignment of this element. I want it to align with the top of the #main box. If I adjust the margins for IE, it doesn't work with Firefox Opera (and vice versa). Right now, it's aligned properly in IE. The selectors in question: #right-side / .promo-image The page is here: http://www.makmystic.com/index.htm The style sheet is here: http://www.makmystic.com/test.css Thanks in advance, Doug Waddell [EMAIL PROTECTED] Sign up today for your Free E-mail at: http://www.canoe.ca/CanoeMail __ 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] CSS Drop Down not working in Mac IE5, help please
hello list -
i have the css code (pasted below) for my dropdown
everything works beautifully elsewhere, except for MacIE5
i think i need to add 'display: block;' somewhere to help this along,
but i have been trying and trying to no avail. Could someone give me a
pointer as to where to look? or what to add to get this to work?
my test page is here:
http://www.law.widener.edu/beta3/menu.html
the menu in question is the the
'Harrisburg Campus, Delaware Campus, Paralegal LNC'
menu
thank you kindly,
cass
Here is my CSS:
#nav {
font-size: .7em;
line-height: 1;
text-align: left;
float: left;
width: 438px;
margin-top: 8px;
/*margin: 0 auto;*/
padding: 0px;
background: #036;
list-style-type: none;
border-bottom: 1px solid #fff;
/*border: 0 none;*/
}
#nav ul {
float: left;
width: 100%;
margin: 0;
padding: 0px;
background: 0 none;
/*background: #036;*/
list-style-type: none;
/*border: 1px solid #fff;*/
border:0 none;}
#nav a {
display: block;
margin: 0 0px 0 0;
padding: 3px 0 3px 10px;
text-decoration: none;
color: #fff;
/*border: 1px solid #fff;*/
border: 0 none;
}
#nav a:hover {
text-decoration: none;
color: #6699cc;
}
#nav li {
float: left;
margin: 0;
padding: 0;
width: 143px;
border-top: 1px solid #fff;
border-left: 2px solid #fff;
border-right: 1px dotted #fff;
background: #036;
font-size: .9em;
font-weight: normal;
}
#nav li.tabone {
border: 1px solid #fff;
border-bottom: 0 none;
border-right: 0 none;
background-color: #036;
font-weight: bold;
font-size: 1.2em;
}
#nav li.tabtwo {
border: 1px solid #fff;
border-bottom: 0 none;
border-right: 0 none;
background-color: #036;
font-weight: bold;
font-size: 1.2em;
}
#nav li.tabthree {
border: 1px solid #fff;
border-bottom: 0 none;
background-color: #036;
font-weight: bold;
font-size: 1.2em;
}
#nav li ul {
position: absolute;
left: -999em;
height: auto;
width: 14.4em;
border-width: 1px;
margin: 0;
}
#nav li li {
padding-right: 1em;
width: auto;
}
#nav li ul a {
width: 10em;
}
#nav li:hover ul {
left: auto;
margin-top:-3px;/*need to move this element up to
prevent menus
from dissappearing upon hover*/
}
__
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 scroll in IE (6/7 Beta 2)
On 2/3/06, Martin Espericueta [EMAIL PROTECTED] wrote: Hello All, This is driving me nuts! Why does my page get a horizontal scroll bar in IE7, and even in IE6 for that matter, when you view the site at 800x600? Firefox/Opera are fine. The XHTML/CSS validate, as well as AAA. On 2/17/06, Martin Espericueta [EMAIL PROTECTED] wrote: http://fiercestreetnetworks.com when i delete this part, it works just fine: DIV class=horizontal-ads SCRIPT src=Web Design Standards_files/yahoo-banner.js type=text/javascript/SCRIPT /DIV!-- end yahoo horizontal -- as an added bonus, deleting this also fixes weird boxing problems i noticed when i loaded the site. only tested on ie6, not 7b2 __ 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] Portfolio display issues (design.zooibaai.nl)
Posted this back to the list again. Maybe someone else is able to help out here? On 17/02/06, cj [EMAIL PROTECTED] wrote: On 2/17/06, Rob Mientjes [EMAIL PROTECTED] wrote: On 17/02/06, cj [EMAIL PROTECTED] wrote: did you figure this out, or are you still needing help? I'm still wondering what the problem is and, to follow your next paragraph, why it doesn't look the same on the test machine. on my machine ie is showing the same thing as in your browser shots pictures. i would recommend trying a different machine to test on for a little bit, as the correct version might *only* work with some settings on that one computer. Shall have to check that then. If you, however, happen to have any clue whatsoever to what's wrong, I'd be very grateful. Thanks in advance. -Rob. __ 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] character box and glyph's hight
In chapter 10.6.1 of CSS specification you can read about two different ways to handle the font-size property. If more than one font is used (this could happen when glyphs are found in different fonts), the height of the content area is not defined by this specification. However, we suggest that the height is chosen such that the content area is just high enough for either (1) the em-boxes, or (2) the maximum ascenders and descenders, of all the fonts in the element. http://www.w3.org/TR/CSS21/visudet.html#inline-non-replaced I'd appreciate any information about which browser in combination with which font is using the maximum ascenders and descenders for content area. The only font with really tall ascenders and descenders I know, is Zapfino. http://www.linotype.com/1175/zapfino-family.html Uwe Kaiser __ 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 on a li in IE
Hi all, I have a css menu, and I would like a stripe to appear a few pixels below each button when I hover. I've done this in Firefox by setting a bottom border on the list item when it is hovered over, but of course this doesn't work in IE. Can anyone point me to a good method that works in IE? View in firefox to see what it is supposed to do: http://procarta.com/beta2 Here's the css: http://procarta.com/beta2/css/text_styles.css Thanks, -Ann __ 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] Aligning text with a background box
One more... I have a css button that I would like to have bottom aligned with the text that it sits next to. Currently, the background box sits below the text line and I can't seem to nudge it upwards. Any ideas on lining it up properly? See the 'go' button toward the bottom of this page: http://procarta.com/beta2/story.php The css is here: http://procarta.com/beta2/css/text_styles.css Thanks! -Ann __ 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 on a li in IE
One thing you could do is set the css to the link instead of the li tags. Then create background images for hover and not-hover states and change the background. This would let you keep the little gap between the outline and the box. -- 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/
Re: [css-d] Horizontal scroll in IE (6/7 Beta 2)
-Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of cj Sent: Friday, February 17, 2006 12:55 PM To: Martin Espericueta Cc: css-d@lists.css-discuss.org Subject: Re: [css-d] Horizontal scroll in IE (6/7 Beta 2) On 2/3/06, Martin Espericueta [EMAIL PROTECTED] wrote: Hello All, This is driving me nuts! Why does my page get a horizontal scroll bar in IE7, and even in IE6 for that matter, when you view the site at 800x600? Firefox/Opera are fine. The XHTML/CSS validate, as well as AAA. On 2/17/06, Martin Espericueta [EMAIL PROTECTED] wrote: http://fiercestreetnetworks.com when i delete this part, it works just fine: DIV class=horizontal-ads SCRIPT src=Web Design Standards_files/yahoo-banner.js type=text/javascript/SCRIPT /DIV!-- end yahoo horizontal -- as an added bonus, deleting this also fixes weird boxing problems i noticed when i loaded the site. only tested on ie6, not 7b2 -- Yes, that's my Yahoo Publisher ad. The dimensions are, well, were, 468x60. I've added a half banner in it's Place - 268x60. Now the horiz. bar is very short at 800x600. Can I use overflow: hidden, or something like that? Best Regards, Martin Espericueta Web Design Standards http://fiercestreetnetworks.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/
Re: [css-d] Absolute newbie needs help with browser differences
[EMAIL PROTECTED] wrote: Hi Folks, Please excuse me if this is in the archives, but I couldn't find anything that helped. I have two problems with positioning on this site: 1. The top navbar. I can't seem to get it to align (to the left edge of the #main box) in IE. After much experimentation (frustration), I got it to display the way it's intended in Firefox and Opera, but not IE. If I make adjustments for one browser (to the ul#topnav selector), it mucks up the other. Any ideas how to make all three work the same way? 2. The right-side image. I'm having similar issues with the top alignment of this element. I want it to align with the top of the #main box. If I adjust the margins for IE, it doesn't work with Firefox Opera (and vice versa). Right now, it's aligned properly in IE. The selectors in question: #right-side / .promo-image /*This style sheet was created by apropel web essentials */ a slightly changed copy of your index file css file (watch out the urls are absolute.), works in firefox and ie (both up2date) without browser specific hacks () - no idea about opera, sorry: http://iamjochem.com/test/makmystic/index.htm __ 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 on a li in IE
Ann Adamcik wrote: I have a css menu, and I would like a stripe to appear a few pixels below each button when I hover. I've done this in Firefox by setting a bottom border on the list item when it is hovered over, but of course this doesn't work in IE. Can anyone point me to a good method that works in IE? Add a span inside the a elements, apply some of the a styles to span, and some of the li styles to a, play with paddings and borders: http://here.locusmeus.com/temp/ann.html -- Els http://locusmeus.com/ http://locusoptimus.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] IE6 hopping left navigation issue
In IE6 the left nav on the site I'm working on is cut-off until one of the links is hovered over. I am using the layout technique from Alex Robinson's article at PIE http://www.positioniseverything.net/articles/onetruelayout/ The main css file can be found here: http://www.kindnesscrew.com/kcrew/css/ScreenBase.css And addition colour scheme specific css files can be found here: http://www.kindnesscrew.com/kcrew/css/cs1/Colour.css http://www.kindnesscrew.com/ek/kindness/index Everything seems to work fine in IE5.5, Safari, Konqueror, Firefox etc. Thanks, Greg. __ 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] Print CSS
I think this is a bit off topic, so please reply off list at: [EMAIL PROTECTED] thank you. I am trying to figure out how to make a print link for the following. So when the visitor presses the print button their printer prints every thing from the name (angus D. F. MacKinnon) to the end on two pages with a small header on page two. hTML: http://infoforce-services.com/personal/generalresume.php CSS: http://infoforce-services.com/css/layout.css Angus MacKinnon MacKinnon Crest Saying Latin - Audentes Fortuna Juvat English - Fortune Assists The Daring Web page http://www.infoforce-services.com Choroideremia Research Foundation Inc. 2nd Vice president http://www.choroideremia.org __ 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 on a li in IE
Fabulous! I was so hoping there would be a nifty way to do this without images or javascript, and this is very nifty indeed. Thanks so much, -Ann Add a span inside the a elements, apply some of the a styles to span, and some of the li styles to a, play with paddings and borders: http://here.locusmeus.com/temp/ann.html __ 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] Aligning text with a background box
Ann Adamcik wrote:
One more...
I have a css button that I would like to have bottom aligned
with the text that it sits next to. Currently, the background
box sits below the text line and I can't seem to nudge it
upwards. Any ideas on lining it up properly?
See the 'go' button toward the bottom of this page:
http://procarta.com/beta2/story.php
The css is here: http://procarta.com/beta2/css/text_styles.css
Since you're working with pixels:
.go {
margin-left: 10px;
position:relative;
top:-7px;
}
You may want to reconsider font-sizes in pixels though. It leaves
IE5/6 users without options to resize the text in their browsers.
--
Els
http://locusmeus.com/
http://locusoptimus.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/
Re: [css-d] nested divs with ul inheritence or not
Still would appreciate any advice, i have just left it as is for now, but would love to have the ul's match widths. thanks much, Michelle __ 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 on a li in IE
Ann Adamcik wrote:
Add a span inside the a elements, apply some of the a
styles to span, and some of the li styles to a, play
with paddings and borders:
http://here.locusmeus.com/temp/ann.html
Fabulous! I was so hoping there would be a nifty way to do
this without images or javascript, and this is very nifty
indeed.
One more thing - I think you may wanna add
a span{
cursor:pointer;
}
to your styles, because IE doesn't do it automatically over a
span, even though it's inside an a.
(added it to the example now too)
--
Els
http://locusmeus.com/
http://locusoptimus.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/
Re: [css-d] Difficulty with CSS image rollovers
Dale Beach wrote: I have a page with image map-based rollovers, and I have resorted to using Dreamweaver's built-in, JavaScript-based rollovers, because I can't get them to work using CSS in IE6. Both a Dreamweaver and a CSS version of the page are on the web: Dreamweaver: http://wolohan.com/pages_01/pfsStocking.php CSS that breaks in IE6: http://wolohan.com/pages_01/pfsStocking2.php I thought that an .htc file might fix it, but that did not work. I've never used .htc files before, I tried using whatever:hover, and another one from www.howtocreate.co.uk, with no luck. [...] Hi all, While not at home, I could not send my reaction to the list. Here is what followed, so this topic can be seen as finished. francky = = = On Feb 17, 2006, francky wrote: Hi Dale, While I’m not on my own computer, I cannot send this mail to the List (will do that tonight). I think the principle of pure css-hover is over here: http://home.tiscali.nl/developerscorner/css-discuss/showathover.htm /exchweb/bin/redir.asp?URL=http://home.tiscali.nl/developerscorner/css-discuss/showathover.htm This works in IE as well, and doesn’t need a htc-file or javascript! Greetings, francky = = = On Feb 17, 2006, Dale wrote: Francky, Thank you very much! This fixed the problem. I've switched the file back to CSS! Dale = = = __ 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] Aligning text with a background box
Els wrote:
Since you're working with pixels:
.go {
margin-left: 10px;
position:relative;
top:-7px;
}
You may want to reconsider font-sizes in pixels though. It leaves
IE5/6 users without options to resize the text in their browsers.
Thanks again - you're my hero today! Unfortunately, the client wants
pixel fonts. They originally wanted all the text rendered, so this is a
step up...
-Ann
__
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] (no subject)
Hi All, Quick question: I am converting some pages to to xhtml strict CSS. What is the correct way to get links to open in a fresh page? I guess the target= _blank function will not validate. Thanks, Max Maxwell Balmain [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-d] using a current class on page links
Hello, I'm new to the list, enjoying all the information and would
like to post a question of my own. I have two columns on either side
of the main section throughout the site. Each are made up of
unordered lists with links. I'd like to have some way for the visitor
to identify which page they are on while browsing through. I've tried
using a class like this one:
.current {
color: #fff;
background: #80;
}
But because of inheritance or some reason, it's not showing up. The
rest of the relevent CSS is below. Any ideas would be appreciated.
Thanks!
Erin Spangler
#lh-col ul li, #rh-col ul li {
border-top: 1px solid #808080;
background: #B2B9D4;
}
ul li a:link, ul li a:visited {
text-decoration: none;
display: block;
width: 90%;
padding: 5px 5%;
font-size: .9em;
color: #33;
}
ul li a:hover {
background: #C0C0C0;
color: #80;
}
ul li.last {
border-bottom: 1px solid #808080;
}
Erin Spangler
http://www.thedogsonline.com
Web Design and Hosting for the dog enthusiast
__
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 current class on page links
Erin Spangler wrote:
[...] I'd like to have some way for the visitor to identify which page they
are on while browsing through. I've tried
using a class like this one:
.current {
color: #fff;
background: #80;
}
But because of inheritance or some reason, it's not showing up. The rest of
the relevent CSS is below.
[...]
Hi Erin,
Perhaps you can give a try in the css with the full path:
#left-top-nav li .current a { color: #fff; background: #80; }
with in html:
div id=left-top-nav
ul
li class=firsta href=begin-here.htmlWhere do I begin?/a/li
lia href=prices-plans.htmlPrices and Plans/a/li
li class=currenta href=sample-pages.htmlSample Pages/a/li
lia href=faqs.htmlFrequently Asked Questions/a/li
lia href=about-us.htmlAbout Us/a/li
lia href=links.htmlLinks/a/li
li class=lasta href=mailto:[EMAIL PROTECTED]Contact Us/a/li
/ul
/div !-- end left-top-nav div --
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] Buttons shifting in form in IE
Hi, am still wondering if anyone knows I can prevent the Submit and Reset
buttons from shifting when clicked in this form:
http://www.drkdesign.com/debscards/cards_form.php
The code for the buttons:
input[type=submit], input[type=reset] {
margin: 15px;
padding: 3px;
width: 5em;
text-align: center;
border: 1px solid #000;
}
Debbie
__
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/
