Re: [css-d] css validation help

2009-07-17 Thread Alan Gresley
Vincent Pollard wrote:
 Hi everybody,
 
 So my css and xhtml almost validate, except for two things:
 
  
 
 1)  The third line here validates in CSS3 but not in CSS2.1 - 
 
 a) does that matter? 

Erik Vorhes has already stated that it doesn't matter.


 b) the overflow-y is the only way I've found to stop the page jumping
 around in IE8. Maybe somebody else has a better solution?
 
 html { 
 
   /* forces scrollbar visible to prevent position jumping in Firefox
 */
 
 height: 100%; 
 
 margin-bottom: 1px;
 
   overflow-y: scroll /* forces scrollbar visible to prevent position
 jumping in IE8 */
 
 }


We would need to see a test case here. It may be IE8 following CSS2.1 to 
  the letter or handling invalid XHTML differently. Get your XHTML valid.


 My style rules for IE6 using the underscore hack, e.g.: 
 
 ..threeColLeft {
 
   _display: inline;
 }
 
 I didn't really want to create a separate stylesheet for IE6 but maybe I
 should if I want validation. What would you do?


Replace the above with,


* html .threeColLeft {
   display: inline;
}


This is valid but should never select anything but IE6 or lower have an 
element outside the html. Chris Wilson of MS was the one who coded it 
in trident (IE rendering engine) in the 1990s.


 Any help,  advice, comments or suggestions - and please no abuse about
 using hacks in the first place - would be gratefully received.


Hack the older browsers by CSS that no browser should use. The above 
works in IE6. This one works in IE7.

*+html .threeColLeft {
   display: inline;
}


This bug or whatever is not present in IE8.

Never use unsupported selectors to target specific browsers. This one I 
used with Safari 3 to target it.

*:not(:root)~html #wrapper2+div[id*=]:not(:first-child)*


Now Safari 4 does not honor empty attribute substring selectors like 
it's cousin Firefox. All such hacks will eventually fail as browsers 
support of CSS improves or if other implementors change course.

The best way is to only hack IE7 or lower since all modern browsers 
(including IE8) should render a page the same way. I would not recommend 
hacking your HTML with IE Conditional comments since they are not in one 
location and thus not easily removed.


 P.S. what really are the advantages of being compliant? I hear it's
 better for SEO and I like the idea, just from a professional pride POV
 but why be compliant. Do a couple of underscore hacks pose a problem?


This has no affect with SEO (which is off-topic here). The underscore 
hack just invalidates the CSS.


-- 
Alan http://css-class.com/

Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
__
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] Fixed or float?

2009-07-17 Thread Alan Gresley
Bobby Jack wrote:
 --- On Thu, 7/16/09, Alan Gresley a...@css-class.com wrote:
 
 Bobby Jack wrote:
 
 ... and an appropriate z-index :)

 None is required for position: fixed. You're positioning,
 not layering (altering the paint order).
 
 Not if there's a relatively-positioned element on the page, in my experience:
 
 http://www.fiveminuteargument.com/fixed-position-z-index
 
 Is this a bug or expected behaviour?
 
 - Bobby


Hello Bobby,

This is indeed expected. You are partly correct and thank you for 
catching me out. I never considered that the original poster (Ellen) had 
anything else positioned. The behavior which you have linked to is 
demo'd here.

http://css-class.com/test/css/visformatting/layers/pos-ab-and-pos-rel-layer1.htm


By changing the source order of the HTML alone will paint the flow of 
elements differently.

http://css-class.com/test/css/visformatting/layers/pos-ab-and-pos-rel-layer2.htm


Source ordering (visually layering / painting) can be achieved without 
any absolute positioning or z-index.

http://css-class.com/test/css/shadows/source-ordered-box-shadow.htm


Absolute or fixed positioning establishes a new 'Block Formating 
Context' [1]. Relative positioning establishes a 'Containing Block' and 
in some cases a new 'Block Formating Context' [2] [3].

None of this changes the painting order (layer) which is painted by 
order of the flow.

Z-index creates a new 'Stacking Context' [4]. You are confusing this 
with the natural painting order generated by elements in the normal flow.


1. http://www.w3.org/TR/CSS21/visuren.html#block-formatting
2. http://www.w3.org/TR/CSS21/visuren.html#containing-block
3. http://www.w3.org/TR/CSS21/visuren.html#relative-positioning
4. http://www.w3.org/TR/CSS21/visuren.html#layers


BTW, I, others on this list and those on the CSS working group list 
tackled such terms as 'painting order', 'stacking order', 'stacking 
context' and 'block formatting context' in 2007 (I'm still somewhat 
confused). Ingo Chao seemed to have visualized this stacking / painting 
dilemma quite well and I guess what is in the spec regarding all this is 
just left as it is.

Rewriting the specs to conform to how browsers handle this stacking / 
painting is a challenge that none have ventured near. Enough said. I 
will leave this to some else to explain better.

;-)


-- 
Alan http://css-class.com/

Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
__
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] color and background of list markers

2009-07-17 Thread David Hucklesby
Jack Bates wrote:
 Is it possible with CSS - possibly CSS 3 - to apply style to the
 things which mark list items?
 
 I have an ordered list, so list items are marked with 1., 2.,
 etc.
 
 I want to make those numbers white on a blue background, and I don't 
 want to change the style of the actual list items (want to leave the 
 actual list items black on a white background)
 
The only way I know involves adding a SPAN or other in-line element to
wrap the content of each list item. Viz:
HTML
   ul
 lispan ... content ... /span/li
 lispan ... content ... /span/li
 lispan ... content ... /span/li
   .
   .
   /ul
CSS
   ul { color: white; background: blue; }
   li span { color: black; background: white; }

Cordially,
David
--
__
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] color and background of list markers

2009-07-17 Thread Philippe Wittenbergh

On Jul 17, 2009, at 3:08 PM, David Hucklesby wrote:

 Is it possible with CSS - possibly CSS 3 - to apply style to the
 things which mark list items?

 I have an ordered list, so list items are marked with 1., 2.,
 etc.

 I want to make those numbers white on a blue background, and I don't
 want to change the style of the actual list items (want to leave the
 actual list items black on a white background)

 The only way I know involves adding a SPAN or other in-line element to
 wrap the content of each list item. Viz:
 HTML
   ul
 lispan ... content ... /span/li
 lispan ... content ... /span/li
 lispan ... content ... /span/li
   .
   .
   /ul
 CSS
   ul { color: white; background: blue; }
   li span { color: black; background: white; }

Counters will do what you want, whit lots of possibilities regarding  
styling.
http://www.w3.org/TR/CSS21/generate.html
sample page
http://dev.l-c-n.com/css2/counters-Ordered_list.html

But not in IE 6  7.

Philippe
---
Philippe Wittenbergh
http://l-c-n.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] Site check please

2009-07-17 Thread David Laakso
Lorraine Barte Nepomuceno wrote:
 Hi guys,

 So far, I've tested this layout in Mac Firefox  Safari, and Windows Firefox
  IE8. I'd love any feedback you might have- especially viewed in other
 browsers and resolutions.

 http://www.splashscreen.com/sample/sample.html

 Thanks very much,
 Lorraine
   




Right column float drop at 800 in all compliant browsers.
Right column float drop at 640 in all compliant browsers; and, 
left-column nowhere to be found.
All browsers render the rivers-- they are more pronounced with 
font-scaling, making the text unreadable.
Left column crossing over the center column in IE/7.
The columns are rail to rail in IE/6; the left column is touchy 
sometimes dropping on a drag in the 1680 to 1280 range; left column 
crosses over center column at 640.





__
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] css validation help

2009-07-17 Thread Erik Vorhes
On Fri, Jul 17, 2009 at 1:29 AM, Alan Gresleya...@css-class.com wrote:

 The best way is to only hack IE7 or lower since all modern browsers
 (including IE8) should render a page the same way. I would not recommend
 hacking your HTML with IE Conditional comments since they are not in one
 location and thus not easily removed.


Alan,

Decentralization of CSS may sometimes pose an issue, but using
conditional comments for IE isn't actually a hack. It's using a
proprietary Microsoft extension; every other browser simply treats
conditional comments as regular comments. The additional benefit of
conditional comments is that you can use other proprietary Microsoft
CSS extensions (e.g., zoom and various JScript expressions) within
them without causing your code to invalidate.

I'd actually argue that if your conditional IE 6-7 CSS files are so
big as to be unmaintainable, it's probably time to revisit how you're
doing your CSS to begin with.

Erik
__
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] Site check please

2009-07-17 Thread Lorraine Barte Nepomuceno
On Fri, Jul 17, 2009 at 10:18 PM, David Laakso da...@chelseacreekstudio.com
 wrote:

 David Laakso wrote:

 Lorraine,

 Getting your page functional in IE 6/7 required hacking it from here to
 Havana. And it still was not right. If you need to keep your current markup,
 then someone else on the list may provide a better solution than I could.

 If, on the other hand, you can live with a different layout structure and
 faux columns, it's a breeze to pull-off without any hacks.
 Please see:
 http://chelseacreekstudio.com/ca/cssd/tres.html

 Checked in: IE 6/7/8. opera/10b, ff/3.5, ff/2x, safari, camino, seamonkey,
 and chrome.

 Best,
 ~d


Thank you, David! That was based on AListApart's Holy Grail, which I
thought I'd try using. I usually stick to Layout Gala's or IronMeyers. But
thank you, thank you for that link. I am most grateful.

:) Lorraine
__
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] Background images not displaying in IE 7

2009-07-17 Thread Ellen Heitman
I'm working on getting a test site up, but in the meantime I was hoping
someone could look over my code quickly and see if anything jumps out as
possibly causing this bug. My background images aren't showing up in IE 7.
They work perfectly fine in both Safari and Firefox.
I've looked over the code endlessly and tried a lot of different hacks from
online forums, but nothing has worked yet. I've tried many times to change
the position of the #indexjacket element, which is not showing up, with no
success. The #textstrip element is also not appearing, although the
#indextext one is. Any ideas??
Here's the HTML:

!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN 
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=UTF-8 /
title- Welcome -/title
link href=wto.css rel=stylesheet type=text/css /
/head
body
div id=indexjacket
div id=textstrip
p id=opena href=toc.htmlOpen/a/p
/div
div id=transbox/div
div id=indextext/div
/div
/body
/html

And the CSS:

body {
background-color:#413a19;
}

#indexjacket {
background: url(images/indexbkgd.jpg);
width:990px;
height:726px;
margin:0 auto;
margin-top:40px;
z-index:1;
position:relative;
}

#textstrip {
background: url(images/textstrip.jpg);
width:1014px;
height:156px;
position:absolute;
top:445px;
left:-10px;
z-index:2;
}

#transbox {
background-color:#66;
width:493px;;
height:379px;
filter:alpha(opacity=50); /* for IE */
opacity:0.5;
z-index:3;
position:absolute;
top:255px;
left:39px;
}

#indextext {
background: url(images/indextext.png);
width:465px;
height:357px;
position:absolute;
top:265px;
left:49px;
z-index:4;
}

#open {
font-family: orator std, courier;
font-size:3em;
position:absolute;
right:25px;
bottom:0px;
padding:0;
margin:0;
}

#open a:link {text-decoration:none; color:#fffde8;}
#open a:visited {text-decoration:none; color:#fffde8;}
#open a:hover {color:#32;}

Thanks for looking!!
__
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] css validation help

2009-07-17 Thread Alan Gresley
Erik Vorhes wrote:
 On Fri, Jul 17, 2009 at 1:29 AM, Alan Gresleya...@css-class.com wrote:
 The best way is to only hack IE7 or lower since all modern browsers
 (including IE8) should render a page the same way. I would not recommend
 hacking your HTML with IE Conditional comments since they are not in one
 location and thus not easily removed.

 
 Alan,
 
 Decentralization of CSS may sometimes pose an issue, but using
 conditional comments for IE isn't actually a hack. It's using a
 proprietary Microsoft extension; every other browser simply treats
 conditional comments as regular comments. The additional benefit of
 conditional comments is that you can use other proprietary Microsoft
 CSS extensions (e.g., zoom and various JScript expressions) within
 them without causing your code to invalidate.

Hello Erik,

This is still hacking HTML for IE7 or lower due to lack of support for 
CSS2.1. My CSS and hacks are *centralized* as oppose to being 
*decentralized* in the HTML. They can be removed in a flash.


 I'd actually argue that if your conditional IE 6-7 CSS files are so
 big as to be unmaintainable, it's probably time to revisit how you're
 doing your CSS to begin with.
 
 Erik


This is how I now serve IE7 or below my special CSS.


http://css-class.com/test/css/selectors/ie/import-hacks.htm


My regular CSS,

http://css-class.com/test/epsilon-0-1.css


and IE7 fixes. Yes there were IE8 beta fixes to.

http://css-class.com/test/test-ie-all.css


My CSS is never unmaintainable, but rather a bit to nasty for the 
browsers to handle. CSS could be much more simpler with much lest ids' 
and classes' in the HTML code and the use of sibling, structural pseudo 
   and attribute selectors.

http://css-class.com/test/css/selectors/


These selectors and minimal use of ids' and classes' in the HTML is 
demo'd here.

http://css-class.com/test/epsilon.htm


This demo holds quite well together in IE7. It even looks better in 
IE5/Mac than it does in IE6. I not here to support IE6 or any other 
antiquated browsers. My CSS is hopefully a glimpse into the future.


-- 
Alan http://css-class.com/

Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
__
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] Columns flying around!

2009-07-17 Thread Andzia
Hello,
I was editing the front page of my website:
http://klikerlab.pl/wordpress/
trying to fit the post info (category, author, date, etc.) into the third
column. When I copied the tags from the article to the third column, the
third and fourth column dropped down. They are not wider than necessary, so
maybe I forgot to close one div? I was checking it in Notepad++ but I
haven't found any open div...
Here is how they should look like -
1st column - a picture
2nd column - the blog post
3rd column - rss icon, a logo image, and meta data about the post
4th column - excerpt of the post and archives
Also, the footer is now above the 3rd and 4th column, but below the first
two...

Thanks for any ideas!
Ania
__
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] Background images not displaying in IE 7

2009-07-17 Thread David Laakso
Ellen Heitman wrote:
 I'm working on getting a test site up, but in the meantime I was hoping
 someone could look over my code quickly and see if anything jumps out as
 possibly causing this bug. My background images aren't showing up in IE 7.
 They work perfectly fine in both Safari and Firefox.
 I've looked over the code endlessly and tried a lot of different hacks from
 online forums, but nothing has worked yet. I've tried many times to change
 the position of the #indexjacket element, which is not showing up, with no
 success. The #textstrip element is also not appearing, although the
 #indextext one is. Any ideas??
 Here's the HTML:
   




Dunno, unless you already fixed it and kept it a secret. And you'll 
likely get more response if you actually brake-down and put your stuff 
on a server. 

All three background images show up on this end [1] in IE 6/7/8 (IE 
Tester/Parallels/Mac 10.4).  Opacity is not supported in Mac  
Opera/10.4; consequently,  the block #transbox is a no-show. However, it 
does show in PC Opera/9.60. Validate the markup: you've got a mangled 
thing.

[1] http://chelseacreekstudio.com/ca/cssd/ellen.html












__
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] Columns flying around!

2009-07-17 Thread David Laakso
Andzia wrote:
 Hello,
 I was editing the front page of my website:
 http://klikerlab.pl/wordpress/
 trying to fit the post info (category, author, date, etc.) into the third
 column. When I copied the tags from the article to the third column, the
 third and fourth column dropped down. They are not wider than necessary, so
 maybe I forgot to close one div? I was checking it in Notepad++ but I
 haven't found any open div...
 Here is how they should look like -
 1st column - a picture
 2nd column - the blog post
 3rd column - rss icon, a logo image, and meta data about the post
 4th column - excerpt of the post and archives
 Also, the footer is now above the 3rd and 4th column, but below the first
 two...

 Thanks for any ideas!
 Ania
   




I may be missing something, but it looks pretty much the way you 
describe it all my browsers. The exceptions are IE 6/7: the footer/nav 
is broken. The page had a number of markup errors several days ago when 
I looked at it. And it still has errors.  Might be worthwhile to validate...




















__
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] width:100%; not rendering 100%

2009-07-17 Thread bill walton
Hi,

I've got a page with two divs, one over the other, both set to 100%
width.  The one on the top is positioned absolute at 0,0.  The one under
it is a nav bar using the sliding window tabs and it's positioned
float:left.  The one on the top is rendering to 100% width while the one
under it is not; leaving margins on both the left and right.

I got it to render close to correct by setting the left-margin to -7px
and the width to 101.5% but as I increase the window width the bottom
scroll bar appears due, I guess, to the percentage getting 'out of
whack'.  At any rate, I'm pretty sure that's not the best way to fix it
anyway.

Could someone please tell me why it's happening and the right way to fix
this? 

The page is at http://ec2-75-101-179-238.compute-1.amazonaws.com

Thanks in advance!
Bill

__
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] width:100%; not rendering 100%

2009-07-17 Thread Erik Vorhes
On Fri, Jul 17, 2009 at 1:32 PM, bill waltonbwalton...@gmail.com wrote:

 I've got a page with two divs, one over the other, both set to 100%
 width.  The one on the top is positioned absolute at 0,0.  The one under
 it is a nav bar using the sliding window tabs and it's positioned
 float:left.  The one on the top is rendering to 100% width while the one
 under it is not; leaving margins on both the left and right.



You need to add this to your CSS:

body { margin: 0; padding: 0; }

Then width: 100% should render the same on both divs.

Erik
__
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] IE 6 Unordered List Issue?

2009-07-17 Thread chasity
We solved the issue. Debug Bar for IE7 helped me track the issue down to 
a style sheet that was only be referenced for a very specific part of 
the site and it turned out that there had been a width assigned to the 
unordered list for that particular layout. Once that was removed 
everything worked fine.

Thanks for your help everyone.
-- 
Chasity McWilliams-Moody
Web Developer
Terry College of Business
Office of Marketing and Communications
W:(706)542-0601
F:(706)542-9473
__
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] 100% body height not expanding beyond viewport

2009-07-17 Thread Jeff Chastain
This is probably basic, but it has me stumped at the moment.  I have a
design where the body background is a single color and then there is a
wrapper around the content which is centered on the page.  The background of
that wrapper is white and is supposed to extend the full height of the page
- even if the content itself does not.  So, my CSS looks like this .

 

html, body {

height: 100%;

background: #d0dce7;

}

#bodyWrap {

position: relative;

width: 90%;
margin: 0 auto;

max-width: 1276px;

min-width: 796px;

min-height: 100%;

}

* html #bodyWrap {

height: 100%;

background: #ff;

}

 

Now, when the context does not extend the full height of the viewport, this
works just fine.  The bodyWrap div extends the full height of the view
port and there is this nice white column going the full height of the page
with blue side bars.  The issue is when the content extends beyond the
height of the viewport.  Then, the bodyWrap div extends with the content
like it should.  However, the body element, or at least the background color
does not extend - it stops at the height of the view port.

 

Can somebody help me out with what I am missing here?

 

Thanks

-- Jeff

 

__
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] Columns flying around!

2009-07-17 Thread Andzia
Yes, because I repaired it somehow... I had a moment of enlightenment ;)
sorry for panicking about this too early. I know that there are some errors
and probably too much unnecessary code... I will try to clean this up. I
should also align the columns to the top of their container (so the
article's title would be aligned to top of the chicken illustration and the
excerpt)... thanks anyway.

2009/7/17 David Laakso da...@chelseacreekstudio.com

 Andzia wrote:

 Hello,
 I was editing the front page of my website:
 http://klikerlab.pl/wordpress/
 trying to fit the post info (category, author, date, etc.) into the third
 column. When I copied the tags from the article to the third column, the
 third and fourth column dropped down. They are not wider than necessary,
 so
 maybe I forgot to close one div? I was checking it in Notepad++ but I
 haven't found any open div...
 Here is how they should look like -
 1st column - a picture
 2nd column - the blog post
 3rd column - rss icon, a logo image, and meta data about the post
 4th column - excerpt of the post and archives
 Also, the footer is now above the 3rd and 4th column, but below the first
 two...

 Thanks for any ideas!
 Ania






 I may be missing something, but it looks pretty much the way you describe
 it all my browsers. The exceptions are IE 6/7: the footer/nav is broken. The
 page had a number of markup errors several days ago when I looked at it. And
 it still has errors.  Might be worthwhile to validate...





















__
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] tool to display web pages in various browsers, OSs and resolutions?

2009-07-17 Thread Don Spark
Is there an online tool which will show you how your webpage looks in
the various browsers, in the various OSs at the various screen
resolutions?

I remember seeing something several years ago. I thought it was linked
from maxdesign.com.au. But I can no longer find it.

Free is better if possible. I remember the old tool had a free period
before pay kicked in

THANKS!
Don Spark
__
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] tool to display web pages in various browsers, OSs and resolutions?

2009-07-17 Thread David Laakso
Don Spark wrote:
 Is there an online tool which will show you how your webpage looks in
 the various browsers, in the various OSs at the various screen
 resolutions?




http://www.browsercam.com/Default2.aspx
And there are many others.
__
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] Site check please

2009-07-17 Thread David Laakso
David Laakso wrote:
 Lorraine Barte Nepomuceno wrote:
   
 Hi David,

 Can you reload the page? I've made some changes (I think my 
 calculations for layout size were wrong :-))... please let me know if 
 it's better now:

 http://www.splashscreen.com/sample/sample.html

 thanks very much
 Lorraine

 

   


Lorraine,

Getting your page functional in IE 6/7 required hacking it from here to 
Havana. And it still was not right. If you need to keep your current 
markup, then someone else on the list may provide a better solution than 
I could.

If, on the other hand, you can live with a different layout structure 
and faux columns, it's a breeze to pull-off without any hacks.
Please see:
http://chelseacreekstudio.com/ca/cssd/tres.html

Checked in: IE 6/7/8. opera/10b, ff/3.5, ff/2x, safari, camino, 
seamonkey, and chrome.

Best,
~d


































__
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] background image shift in IE6

2009-07-17 Thread Dan Katz
Hi folks,

Please take a look at
http://www.savvyrest.com/products/organic-mattresses in Firefox vs
IE6.

The active tab background image appears to shift in IE6 about 25
pixels vertically. Any ideas?

Thanks so much,

-- 
Dan Katz

http://www.linkedin.com/in/mtndan
__
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] 100% body height not expanding beyond viewport

2009-07-17 Thread Jeff Chastain
This has not appeared on the list yet, so I apologize if it ends up
duplicated.  Thx.

 

From: Jeff Chastain [mailto:li...@admentus.com] 
Sent: Friday, July 17, 2009 4:01 PM
To: 'cs...@css-discuss.org'
Subject: 100% body height not expanding beyond viewport

 

This is probably basic, but it has me stumped at the moment.  I have a
design where the body background is a single color and then there is a
wrapper around the content which is centered on the page.  The background of
that wrapper is white and is supposed to extend the full height of the page
- even if the content itself does not.  So, my CSS looks like this .

 

html, body {

height: 100%;

background: #d0dce7;

}

#bodyWrap {

position: relative;

width: 90%;
margin: 0 auto;

max-width: 1276px;

min-width: 796px;

min-height: 100%;

}

* html #bodyWrap {

height: 100%;

background: #ff;

}

 

Now, when the context does not extend the full height of the viewport, this
works just fine.  The bodyWrap div extends the full height of the view
port and there is this nice white column going the full height of the page
with blue side bars.  The issue is when the content extends beyond the
height of the viewport.  Then, the bodyWrap div extends with the content
like it should.  However, the body element, or at least the background color
does not extend - it stops at the height of the view port.

 

Can somebody help me out with what I am missing here?

 

Thanks

-- Jeff

 

__
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] 100% body height not expanding beyond viewport

2009-07-17 Thread David Laakso
Jeff Chastain wrote:
 This is probably basic, but it has me stumped at the moment. 


 Thanks

 -- Jeff


   



Same here.
Put your stuff on a public server and provide a clickable link to it in 
your post to the list.









__
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] ie6 float problem

2009-07-17 Thread Richard Lake
Hi,

I have a page that displays appropriately in Firefox, Safari, Ie 7 + 8 but,
according to browsershots, is not displaying properly in Ie6. 

A sample page with the problem can be found at:
http://www.web-devel.co.nz/myvreo/test.html
Note: The other links should take you to a login page because the page would
normally be visible only to users that have logged in.

The line beneath the tabbed menu contains an image, a menu list (add New
Buyer, etc) and a search form. They line up correctly in the modern browsers
but in ie6 (according to browsershots) the search form is to the left and
above the image and menu instead of being on the right.

The image is floated left of the ul menu and the form is floated right.

I've validated the html and the css and there doesn't appear to be any
errors that are associated with the problem.

I'm pulling my hair out trying to sort the problem out because I can only
check changes via browsershot and the turn-around is quite slow (and so far
unproductive).

Help greatly appreciated.

Regards

Richard


__
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/