[css-d] Font-Family: Calibri, Verdana, ...
Font-family: Calibri, Verdana, Ariel, sans-serif; Is there a solution which will size Calibri so it roughly matches Verdana and Ariel (which works cross-browser)? (Calibri is a new MS font which renders about 20% smaller than Verdana.) __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Keeping a div positioned in Viewport
I have an application with vertical scrolling. I'd like to keep a div positioned in the viewport. Before I resort to beating it up with JavaScript, is there a CSS technique, maybe with minor JavaScript, which works well across browsers? Sam __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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 6, 7 Float problem, works in Firefox
Maybe I don't get float. Maybe this is a known bug...
I've made a bare-bones sample page to show my misunderstanding... or the
bug...
mhtml:{0CCD3315-325B-41A0-8F7A-971ACF2C88CC}mid://0014/!x-usc:http://tr
ainthetrainers.net/home2.php http://trainthetrainers.net/home2.php
There's a float : right image. Yes... it's a beaver wearing a shirt. He's
Canadian too.
Start with a wide browser display of more than 1000px and shrink the width
below 800px. The div#inner with the red border will clear the float.
It seems like a bug to me, or am I misunderstanding float? Isn't the
floated image supposed to glide right over the inner div schooching the
inline-text out of the way?
Interesting... If I remove the width : 700px on #inner, it behaves
properly, not clearing the image.
I'd like the inner div with the red border to not clear the image, but I'd
like the inline text to clear the float as always.
Seems to work properly in Firefox.
But or not, is there a fix?
Sam
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] Firefox outline-
Another minor problem...
http://trainthetrainers.net/home2.php
Using Firefox, click the radio button at the bottom of the text. There's an
outline.
I've tried to remove the outline using
input, input:focus {outline-width: 0 !important; outline-style:none
!important; }
Can the outline be removed with css?
Sam
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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 better way to show photos with a bio?
Each paragraph is bumping into the previous floating image which is
extending below and outside the previous paragraph.
You can see this phenomenon by adding a border to the paragraph...
P { border: 1px solid red;}
To fix the problem, add clear : both and margin-top to the paragraph
P {
clear : both ;
margin-top: 20px;
}
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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] font-size-adjust
font-size-adjust is supposed to specify the aspect ratio of the first font
in a family... e.g.
font-family: Verdana, 'Times New Roman', serif;
font-size: 12pt;
font-size-adjust: 0.58;
In Cascading Style Sheets, Second Edition, by Hakon Wium Lie and Bert
Bos., the discussion of font-size-adjust begins on page 112. Here's an
excerpt from page 113:
For example, if 10px Verdana (with an aspect value of 0.58) was unavailable
and an available font had an aspect value of 0.46, the font-size of the
substitute would be 10px * (0.58/0.46) = 12.61px
This quote applied to:
BODY {
font: 10px Verdana, Times New Roman;
font-size-adjust: 0.58;
}
The example given clearly shows that the browser knows the x-height of
Times New Roman to do the calculation. I don't see why a CSS coder should
need to code the x-height of the first font, Verdana?
Wouldn't it make more sense to simply enable or disable font-size-adjust?
What am I missing?
Sam
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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 centering in a table cell using CSS
Is there a way to vertically center content in a table cell using CSS (not HTML)? Sam __ 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] Vertical centering in a table cell using CSS
CJ Larson wrote:
Is there a way to vertically center content in a table cell using CSS
(not HTML)?
A CSS table cell or an HTML table cell?
This is a td cell
CSS:
[assume markup - div class=vcenter]
.vcenter {display: table-cell;vertical-align: middle;height: 100%;}
This doesn't seem to center vertically in either IE 6 or Firefox...
My mistake or is there a correction?
Sam
__
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] Viewport positioning and cross-browser support]
I've got a couple of HTML layout controls I'd like to keep positioned in the page ViewPort. I believe CSS alone can do it for Mozilla, but a JavaScript is necessary for IE? Then there's Safari. Any pointer to a good cross-browser solution that fails safe (e.g. fails to a CSS absolute position in the body)? Thanks, Sam __ 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] Viewport positioning and cross-browser support]
Christian Heilmann wrote: I am confused as to what you are trying to do... Are you trying to position elements fixed and when the user scrolls they stay? Are you trying to position elements absolutely inside another element? The latter is easy, just position the parent element relatively, the former is possible on the viewport, but possibly not relative to another element. Sorry if I wasn't clear. I'm not an expert on this, I understand the term Viewport refers to is the device display. I'm going from memory but somewhere I read that In W3C terms, the Viewport is the html element and the body element scrolls around in the Viewport?. I want certain controls (HTML elements) to remain fixed on the Viewport (display) when the user scrolls vertically. It is easy to do in Mozilla with CSS. I seem to recall that it can't be done in IE with CSS but that there may be a JavaScript that'll get the job done. Then I've found some references that seem to suggest there may be a CSS solution for IE. I thought there might be a mature cross-browser solution somewhere. Sam __ 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/
