Re: [css-d] h1 vertical jump
On Feb 10, 2011, at 5:26 PM, David Laakso wrote: > On 2/10/11 4:43 PM, Shawn Lawler wrote: >> On 2/10/2011 2:24 PM, David Laakso wrote: >>> >>> <http://chelseacreekstudio.com/makeover/journal/index.php> >>> >> >> >> Times New Roman (the first of your other typefaces which chrome is using on >> my machine when the web-font files aren't present) is either rendering >> beforehand, or is being used to calculate an initial line-height for that >> H1. Take a peak--gut your web-font rules and you might notice your >> "fallback" font is 'taller' than your web-font by approx. the same amount of >> the jump you're seeing. >> >> Shawn >> > > > Fallback fonts reset to only Georgia, serif; and, while this does not > entirely correct the issue-- it does make it far less noticeable. I don't see the problem in Safari, but do see it in Firefox. You might find this info on fixing similar Typekit problem interesting -- http://blog.typekit.com/2010/10/29/font-events-controlling-the-fout/ -- Lowell Allen __ css-discuss [css-d@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] Grid Based Layout
On Jun 10, 2010, at 9:03 AM, Nick Leaton wrote: [snip] > On Wed, Jun 9, 2010 at 8:14 PM, David Hucklesby wrote: >> On 6/9/10 5:09 AM, Nick Leaton wrote: >>> I'm trying to do some layout of some html. >>> >>> The basic idea is to get six divs laid out into a grid pattern of two >>> columns and three rows. >>> Each div has a separate id and I want the CSS to determine the layout >>> and which column >>> and row is used to display the data. >>> >> [...] >> >> Here ya go: >> >> http://webwiz.robinshosting.com/temp/css-table-layout/ [snip] Take a look at CSS code for this popular grid system: <http://960.gs/> -- Lowell Allen __ 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] HTML buttons not clickable in IE6
On Apr 28, 2007, at 6:34 PM, Bruno Fassino wrote: > Lowell Allen wrote: > > [...] >> >> Variable text goes here >> >> >> But then only the text is linked, and users expect the entire button >> to be clickable. I can make that happen by replacing h5 with >> a styled >> span (to validate) and enclosing within the anchor: >> >> >> >> >> Variable text goes here >> >> >> >> >> This works in Firefox, Safari, and IE7, but not IE6. In IE6 only the >> text is clickable, just as before. >> >> Example at <http://www.lowellallen.com/simplify/letter.php? >> product_id=7&sid=5> (buttons within the letter). > > > Sometimes anchors in IE6 needs hasLayout to be fully clickable [1]. > Try adding display:block and zoom:1 (or any other hasLayout > trigger) to > your anchors. > BTW, I believe that you can get the full area clickable with the other > markup as well, using again display:block (should be sufficient for > good > browsers) and zoom:1 (for IE6) Bruno, I added "display:block" and "zoom:1" to my IE6 styles for "div.boxbutton a" and that fixed the IE6 problem. I also tried simply adding "display:block" for "div.boxbutton h5 a" to see if that would make the entire button clickable using my original markup, but although it did help (more button area clickable), the second markup example is needed to make the entire button clickable. Thanks -- that saves me the time and trouble of creating TONS of graphic buttons! -- Lowell Allen __ 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] HTML buttons not clickable in IE6
In order to generate order buttons from a CMS, I did the buttons as h5 text within a styled div. The div background image and h5 background image combine to make the button image, and the h5 text is linked: Variable text goes here But then only the text is linked, and users expect the entire button to be clickable. I can make that happen by replacing h5 with a styled span (to validate) and enclosing within the anchor: Variable text goes here This works in Firefox, Safari, and IE7, but not IE6. In IE6 only the text is clickable, just as before. Example at <http://www.lowellallen.com/simplify/letter.php? product_id=7&sid=5> (buttons within the letter). Is there a way to make this work in IE6? -- Lowell Allen __ 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] Absolutely positioned footer crashes Safari
On Feb 22, 2006, at 10:14 PM, Philippe Wittenbergh wrote:
>
> On Feb 23, 2006, at 6:39 AM, Lowell Allen wrote:
>
>> I'm getting consistent crashes of Safari (OS X 10.3.9, Safari 1.3.2
>> v312.5) on a page with an absolutely positioned footer:
>> <http://carbon.liquidweb.com/~shelbypr/upload_files.php>. The form on
>> that page uses Javascript to hide file upload input fields unless
>> selected from a select list. Troubleshooting reveals that removing the
>> absolutely positioned footer stops the crash. It's like Safari can't
>> calculate where to put the footer with the Javascript function running
>> on page load, which determines the height of the form and the
>> relatively positioned parent of the absolutely positioned footer.
>>
>> With an earlier version of this layout I also noticed that Safari
>> wasn't able to position the footer correctly when clearing of floated
>> elements changed the height of the relatively positioned parent of the
>> footer.
>
> It crashes nicely running Safari 2.0.3 (not surprising, Safari 1.3 and
> 2.03 are the same code base).
>
> Instead of using position: absolute for your footer, just leave it in
> the flow, and use clear both. That would also allow you to get rid of
> the width and height on the #footer, which causes the text to drop out
> partly in my browser (Camino 1.0+, min-fontsize set to 14px). Just add
> a clear: both to clear the two floated columns.
>
> #footer {
> /*position: absolute;
> bottom: 0;
> left: 0;*/
> clear:both;
> /*width: 750px;
> height: 24px;*/
> background-color: #FFF;
> border-top: 1px solid #CCC;
> }
> Works fine on my side (tested with Camino, Opera 9tp2, Firefox 1.5 and
> Safari.
>
> PS, your page doesn't crash on the latest WebKit nightly build.
Thanks for your reply, Philippe. I decided I needed to generally
re-code to support Mac IE5 and ended up with something that's similar
to what you suggest above but also like the sticky footers from the
recent "how to keep footers at the bottom" thread. (And it doesn't
crash Safari, of course!)
--
Lowell Allen
__
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] Absolutely positioned footer crashes Safari
I'm getting consistent crashes of Safari (OS X 10.3.9, Safari 1.3.2 v312.5) on a page with an absolutely positioned footer: <http://carbon.liquidweb.com/~shelbypr/upload_files.php>. The form on that page uses Javascript to hide file upload input fields unless selected from a select list. Troubleshooting reveals that removing the absolutely positioned footer stops the crash. It's like Safari can't calculate where to put the footer with the Javascript function running on page load, which determines the height of the form and the relatively positioned parent of the absolutely positioned footer. With an earlier version of this layout I also noticed that Safari wasn't able to position the footer correctly when clearing of floated elements changed the height of the relatively positioned parent of the footer. I don't see any problems with Windows IE6, Firefox 1.5 on Windows or Mac. Mac IE5.2 is a disaster. Anybody willing to test in the latest version of Safari? Anybody know of related general float clearing problems with Safari? -- Lowell Allen __ 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] image replacement problem in Mac IE
I'm having a problem with Fahrner Image Replacement in Mac IE 5.2. I'm floating "button" links within paragraphs. When the floated button isn't followed by a paragraph, the image replacement works fine, but when a paragraph follows the floated div the button images are not clickable links. I've put up a test page with the CSS in the head at <http://www.lowellallen.com/FIR_test.html>. Can anyone advise how to get this working in Mac IE? -- Lowell Allen __ 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/
