Re: [css-d] :: Tables or Divs ::

2008-09-10 Thread Jim Davis
This post has links to a number of different articles on the subject of CSS
forms:

http://www.smashingmagazine.com/2006/11/11/css-based-forms-modern-solutions/

Jim
www.jimdavis.org
__
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/


Re: [css-d] Testing CSS for higher screen resolutions

2008-08-22 Thread Jim Davis
Here is what the left side looks like on my 1928 wide monitor.

http://www.jimdavis.org/polkadot.jpg

You may want to consider centering the header content for viewing on wider
monitors.

Jim
www.jimdavis.org



On Fri, Aug 22, 2008 at 3:20 PM, Polka Dot Cottage Admin 
[EMAIL PROTECTED] wrote:

 Hi.

 My screen resolution is 1024x768, and the content of my site fits that
 window nicely.  I want to test how it will behave on a monitor with higher
 resolution.

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


Re: [css-d] CSS Resources

2008-08-19 Thread Jim Davis
Here is a good css reference:

http://reference.sitepoint.com/css

Jim
www.jimdavis.org
__
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/


Re: [css-d] Vertical Positioning?

2008-07-24 Thread Jim Davis
I would change:

#content { position: relative; }

and

.test { position: absolute; left: 0; bottom: 0; width: 198px; height: 175px;
text-align: center; }

Jim

On Thu, Jul 24, 2008 at 3:37 PM, Matthew Stoneback 
[EMAIL PROTECTED] wrote:

 I asked this once before and never received a response from the group so I
 thought I would try one more time.

 At the link located below, is there any way to position Test Image Box at
 the bottom of the column on the left hand side?  I know I can vary the top
 margin of the div test on each page to force this image to a position,
 but
 I wanted to avoid doing this for every page.  I also though absolute
 positioning might work but have not tried it yet.  Any suggestions on how I
 can make this work?

 HTML: http://dev.eddysound.com/dev/msc/

 CSS: http://dev.eddysound.com/dev/msc/main.css

 Any help on this would be greatly appreciated.  I just need to know if I am
 trying something which is impossible to achieve in CSS.

 Thanks!

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


Re: [css-d] Background Auto Size

2008-06-07 Thread Jim Davis
Christopher,

Try this:
http://www.jimdavis.org/test/imagetest1.html

Not very elegant, but it seems to work.

Jim

On Sat, Jun 7, 2008 at 8:00 AM, Christopher [EMAIL PROTECTED] wrote:

 I would like to know if CSS is capable of this if you create a
 background image that is a fixed size and want it to resize based on
 the browser window resizing is this possible ?
__
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/


Re: [css-d] Misc classes naming conventions

2008-05-12 Thread Jim Davis
black-button, grey-button might work.
Jim

On Mon, May 12, 2008 at 7:10 AM, Lee Powell [EMAIL PROTECTED] wrote:

 Hi

 I'm working on a new project, and I'm keen to get my naming conventions
 down
 to convey meaning in what I'm marking up.
 Anyway, design have produced a layout which makes use of the normal
 elements
 along with 2 rather odd block style buttons, there's nothing unique about
 them, except they are normal anchors with a bit of padding. One style has
 a
 black background and the other grey, both with white text.

 So my markup looks like this:

 span class=buttona href=...This is a button/a/span

 So I need a naming convention to differentiate between the two, and I
 really
 don't want to use 'black' and 'grey' for obvious reasons, 'style-a' and
 'style-b' doesn't seem to convey much meaning...

 So has anyone else got other ideas on how to name these seemingly
 miscellaneous elements?

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


Re: [css-d] Lost in positioning masthead image

2008-05-03 Thread Jim Davis
Robert,

Here is a demo where the image is floated left and a div containing the text
is also floated left:
http://www.jimdavis.org/test/chess.html

Jim

On Sat, May 3, 2008 at 6:54 PM, Robert Lane [EMAIL PROTECTED] wrote:

 My example page is at: http://tinyurl.com/3r8rhu

 I seem to be a bit rusty here and am struggling with positioning an
 image and some text in the mast head.

 I have a div named masthead.  A div within that named content.  In the
 content div I want an image (yes I hate animated gifs too!) to the left
 side of the masthead.  Then I would like the Main Heading h1 LeChess
 Club/h1 followed by the tag line of pA Society for Better Chess /p

 So basically --- Image---   Heading
 tag line
 I may want to be able to play with the padding around the image for best
 placement, But I want both lines of text to line up to the right of the
 image rather than below it.

 What is generally the best and/or easiest way to do this?  Do I need to
 use position, float, or what?
__
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/


Re: [css-d] list nav not working as needed

2008-05-01 Thread Jim Davis
Cory,

Can you upload your page to a server and send us the URL?

Jim

On Thu, May 1, 2008 at 12:58 PM, Cory Shubert [EMAIL PROTECTED]
wrote:

 Trying again, looking for a few ideas on where to go...

 I am having a problem and can't seem to see the elegant solution.  I
 have a simple ul list nav with rollover states.  I need to have the
 selected state show without any background, just white, to blend in with
 the content below it.

 The nav was created in CSS and didn't have this look built in and I just
 can't seem to figure it out without wasting a ton of code to do it.  I
 have tried to have a selected or non link style so that the background
 would just be white, but if the selected link is selected, then it
 doesn't need a ahref tag and thus breaks the CSS function...

 Any help would be greatly appreciated.



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


Re: [css-d] Wrapper isn't wrapping!

2008-04-08 Thread Jim Davis
Stuart,

You have given the ul an id of mainNav and it is closed by /ul. If you
had:
div id=mainNav
ul.../ul
/div
You would need the closing /div.

Jim


On Tue, Apr 8, 2008 at 2:12 AM, Stuart Walsh [EMAIL PROTECTED] wrote:

 Jim Davis wrote:

  Hi again,
 
  Note:
  ul id=mainNav
  lia href=instrument.htmlthe instrument/a/li
  lia href=composers.htmlcomposers/a/li
  lia href=music.htmlmusic/a/li
  lia href=gallery.htmlgallery/a/li
  lia href=#links/a/li
  lia href=#contact/a/li
 
  /ul
  /div *THIS IS CLOSING #WRAPPER
 
  *Jim*
  *
 


 Many thanks for your  help. And thanks to others for their suggestions
 too.

 But  I still don't understand one particular thing, and I must be
 fundamentally misunderstanding something! Surely the /div you have
 highlighted only closes the #mainNav div. Doesn't the overall #wrapper need
 a closing /div too? I've looked over my html many times. I have  an
 overall wrapper div and within that a number of divs and all have their
 opening and closing tags.

 I've tried removing the final /div which I had assumed was the closing
 /div for the wrapper. Nothing happens - so I really must be doing
 something wrong.


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


Re: [css-d] Wrapper isn't wrapping!

2008-04-07 Thread Jim Davis
Stuart,

In #wrapper add display: table; and you will see the border on the left side
of the page in FF.

Jim

On Mon, Apr 7, 2008 at 3:21 PM, Stuart Walsh [EMAIL PROTECTED] wrote:

 I must be making a clumsy, beginner's, mistake somewhere but I just
 can't figure out what is the problem.

 The CSS validates but isn't working as it should. Here is the page:


 http://www.tuningsinthirds.com/cytre/

 and the CSS:

 http://www.tuningsinthirds.com/cytre/new.css

 I can't get the wrapper div to wrap around everything  - the header,
 mainNav, content and footer divs. The markup looks very basic but in FF
 the wrapper is only wrapping the header.
 But in IE it does wrap around the two floated divs, the 'content' and
 'mainNav' but not the footer.

 (I've run the W3C html validator and there are indeed some errors - but
 I can't make sense of them)

 Any advice would be much appreciated.
__
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/


Re: [css-d] Wrapper isn't wrapping!

2008-04-07 Thread Jim Davis
Hi again,

Note:
ul id=mainNav
lia href=instrument.htmlthe instrument/a/li
lia href=composers.htmlcomposers/a/li
lia href=music.htmlmusic/a/li
lia href=gallery.htmlgallery/a/li
lia href=#links/a/li
lia href=#contact/a/li

/ul
/div *THIS IS CLOSING #WRAPPER

*Jim*
*

On Mon, Apr 7, 2008 at 3:21 PM, Stuart Walsh [EMAIL PROTECTED] wrote:

 I must be making a clumsy, beginner's, mistake somewhere but I just
 can't figure out what is the problem.

 The CSS validates but isn't working as it should. Here is the page:


 http://www.tuningsinthirds.com/cytre/

 and the CSS:

 http://www.tuningsinthirds.com/cytre/new.css

 I can't get the wrapper div to wrap around everything  - the header,
 mainNav, content and footer divs. The markup looks very basic but in FF
 the wrapper is only wrapping the header.
 But in IE it does wrap around the two floated divs, the 'content' and
 'mainNav' but not the footer.

 (I've run the W3C html validator and there are indeed some errors - but
 I can't make sense of them)



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


Re: [css-d] Bullet list without paragraph break

2008-04-06 Thread Jim Davis
The rule is display: inline

See
http://css.maxdesign.com.au/listamatic/horizontal01.htm
for a basic example.

Jim



On Sun, Apr 6, 2008 at 7:07 AM, The Color Guard [EMAIL PROTECTED]
wrote:

 Hi, I'm new to CSS and new to the list. I just started going through the
 exercises in Meyer's book, and they're great -- I am catching on.
 Meanwhile, I ran across a problem which might be basic html; I hope y'all
 don't mind. (Maybe it could be solved with CSS.)
 I want to make a bulleted list, but without the paragraph break before and
 after the list. Is this possible? This is the code I found:
  ul
  liFirst item
  liSecond item
  liThird item
  /ul
 It automatically includes a paragraph break, frustratingly.

 Also -- is there a way to post questions on the css-discuss site? I don't
 find any log in or post buttons. Does this mainly work as a mailing
 list, rather than a bulletin board?

 Thank you,
 Suzi
__
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/


Re: [css-d] a:hover with absolute positions

2008-04-06 Thread Jim Davis
Tony,

You may find it worthwhile to read this article and study the demos.
http://www.alistapart.com/articles/sprites/
You should be able to achieve your design with a single ul and css (and
your image, of course).
I use a bit of php to show the currently selected page and can send you that
code if you wish.

Jim


On Sun, Apr 6, 2008 at 10:15 AM, tony [EMAIL PROTECTED] wrote:

 Hi,

 Well on the way to creating my first ever webpage but have run into a
 problem.
 To create my vertical navigation tabs and using my graphic image, I have
 to,
 I believe, absolutely position both the graphic and the text.
 This works fine but on a:hover the text and the graphic indicate
 separately
 rather than together. I have tried various ways to combine the text and
 the
 pictures on the same li without success.
 See: http://www.spiess.plus.com/

 I don't know whether Im dealing with a syntax error, using the wrong
 selector or just asking the impossible.
 Can any one point me in the right direction please.

 Tis early days and still to do:
 Fine tune text spacings
 Overcome a:visited problem
 Set div up for current page indicator
 Correct for IE6 bugs
 Validate code
 Arrange print version sheet

 Looming over the horizon resolve a pagewrap div problem with a
 disappearing
 border.
 And then Im there!

 Thanks inadvance
 Tony


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


Re: [css-d] [css] Sticky footer problems

2008-03-22 Thread Jim Davis
Here is a link to an article and demo for a technique to create css frames.
It uses a fixed header and a sticky footer. Perhaps you will find
inspiration for your footer here:

http://www.456bereastreet.com/archive/200609/css_frames_v2_fullheight/

Jim

On Sat, Mar 22, 2008 at 1:31 PM, Krystian - Sunlust [EMAIL PROTECTED]
wrote:

 Hello,

 ...
 Couldn't really find an example of working sticky footer to be honest,
 since
 most websites have enough content to _always_ fill my above the fold
 space.

 Example of my problem is here:

 http://sunlust.net/portfolio.htm

 As you can see, in any browser I get a messed up look and footer doesn't
 stick, even tho I tried applying one of methods I googled.

 ...

 Thanks in advance.

 --
 Krystian - Sunlust
 Sunlust Designs
 http://sunlust.net
__
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/


Re: [css-d] IE6 dropping floats

2008-03-14 Thread Jim Davis
How about making mid-container-inner a static div rather than floated, then
floating one of the ul's left and the other ul floated right. See this demo:

http://www.jimdavis.org/test/list_this.html

Will re-size gracefully in IE6 win, FF 2.0 and Opera 9.26

Jim

On Fri, Mar 14, 2008 at 11:27 AM, Julie Wetherill [EMAIL PROTECTED]
wrote:

 I have a 3 col layout, with left/right columns floated. Inside the center
 column, I have nested a container div within which are 2 float more divs
 floated left. Within these I have vertical lists. The goal is 2 vertical
 lists sidebyside. Here is the page:

 http://hul.harvard.edu/oisnew/systems/oasis/upload.html

 In IE6, any squeezing of the viewport causes the entire center column to
 drop below the layout. This is not happening for other pages with
 unfloated
 content. The problem page has onboard styles in the header, which are:

 .mid-container {  border: 0;  float: left;  width: 95%;  border:
 0;  margin: 0;  padding: 0 }
 .mid-container-inner { float: left;  width: 48%;  border: 0;  margin:
 0;  padding: 0  }
 .mid-container-list {  padding-left: 0; margin-left: 0;  }
 .mid-container-list li {  padding-left: 0; margin-left: 1.5em;  }

 Any suggestions on how to prevent those inner floated divs from dropping
 below the layout?

 Thanks. --julie
__
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/


Re: [css-d] forcing an entire li to be a link

2008-03-11 Thread Jim Davis
Take a look at this article and demo:
http://www.smileycat.com/miaow/archives/000230.php

Jim

On Tue, Mar 11, 2008 at 9:27 PM, linojon [EMAIL PROTECTED] wrote:

 Here's a demo of my problem http://www.parkerhill.com/hover-test.html

 When this page is viewed in Firefox or Safari, and you hover over any
 of the list items, you can link to the 'overlaid' link. But in IE7,
 you must only hover over whitespace to have a link; if you hover over
 text it wants you to select text. Changing the order of elements, or
 using nested div's doesnt seem to help.

 Is there a way to force IE to make the entire li a link?
 or a better way to accomplish this that works in all browsers?
 (and preferably without using javascript)

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


Re: [css-d] a picture with in a picture

2008-03-06 Thread Jim Davis
Here is a way to have the frame in as a background in the css and adding the
image in the body of the html:
http://www.jimdavis.org/test/frame_demo.html

Jim


On Thu, Mar 6, 2008 at 6:57 PM, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote:

 Is it possible to have an image showing a picture frame and have that
 as part of the css style sheet.

 Then in HTML on different pages use that frame to cover over an
 image, giving the image a nice decorative picture frame.

 Don't know if I'm pushing the limits.

 thanks in advance
 chris
 __
 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-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/


Re: [css-d] how to center this suckerfish?..

2008-03-01 Thread Jim Davis
Julie,

The ul will need a width in order to be centered in your 100% wide #nav. For
example

#nav {
width: 100%;
...
...
}

#nav ul {
width: 80%;
margin: 0 auto;
...
...
}

Jim

On Sat, Mar 1, 2008 at 1:48 PM, Julie Bessette [EMAIL PROTECTED] wrote:

 Hi everyone,

 I'm wondering if anyone can throw me a bone - I'm a css-newbie, and I've
 spent an embarrassing amount of time trying to center this menu... I know
 I'm probably missing something obvious...

 http://www.studiolumineux.com/menusample.htm

 If I could stop the top-level menu items from wrapping, that'd be the
 icing
 on the cake!!

 :)

 Thanks for any help you can throw my way...

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


Re: [css-d] IE fails to shrink width

2008-02-28 Thread Jim Davis
Question: Will all of the images always be the same width?

Jim

On Wed, Feb 27, 2008 at 6:35 PM, Russell Robinson [EMAIL PROTECTED]
wrote:

 Hi all,

 I have a problem that affects IE6 and IE7 (I haven't tested IE5.5).

 I've created a test case:
http://www.tectite.com/tests/iewidthtest.htm

 Firefox and Konqueror (FWIW) work exactly as intended.

 The aim is to get an image bounded by a frame (not browser frame) that
 also
 includes some caption text.

 IE expands the frame's div so that the border is the entire width of the
 content instead of fitting it nicely around the image.
 ...

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


Re: [css-d] one pixel line to much, and a serious ie6/ie7 problem

2008-02-22 Thread Jim Davis
Change

 #navbar {
  height: 30px;

to about 26px. Fixes FF problem.

Jim

2008/2/22 vwf [EMAIL PROTECTED]:

 The URL:
 http://www.opeform.nl/test/

 Sorry!!
__
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] Online CSS Reference available from SitePoint

2008-02-19 Thread Jim Davis
All,

The folks at SitePoint have put together what appears to be a fairly
comprehensive online CSS Reference. Check it out:

http://reference.sitepoint.com/css

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


Re: [css-d] Center multiple float lefts site check....

2008-02-14 Thread Jim Davis
Matt,

Try:
#topNav { width: 765px; height: 28px; margin: 0 auto; list-style: none; }

No need to float #topNav left if you are trying to center it. Just adjust
the width of #topNav to fit the width of the all the elements inside and set
the margin to 0 auto.

Jim

On Thu, Feb 14, 2008 at 9:07 PM, Matthew Stoneback [EMAIL PROTECTED]
wrote:


 Okay, now onto my dilemma.  How do you center a group of images / links
 that
 are floated left in CSS?  The site I am trying this on is here:
 http://www.eddysound.com/rrc/index_help.html  The CSS for the page is
 here:
 http://www.eddysound.com/rrc/main_help.css

 The part of the page I would like to center is all of the links located at
 the very top of the page (in white).
  http://www.evolt.org/help_support_evolt/

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


Re: [css-d] Need help with a float inside a DIV

2008-02-13 Thread Jim Davis
Remove clear: left; from .header-text and clear the float later in the
markup.

Jim

On Feb 13, 2008 7:59 AM, Webmaster [EMAIL PROTECTED] wrote:

 I've got what seems to be a simple problem, but I can't find the answer.
 I've got this page: http://www.tusculum.edu/bookstore/new.html

 I have a simple heading with an logo image, and I want to float the
 address text to the right inside the header DIV. I tried this, but in both
 IE and Firefox, the text drops out of the header DIV. I tried putting the
 image in a DIV and floating it to the left, but that still doesn't work with
 Firefox, and it looks ugly in IE.

 The relevant CSS file is here:
 http://www.tusculum.edu/bookstore/css/box.css

  I apologize in advance for the ugliness of the CSS and the simplicity of
 this problem, but I appreciate any help. Thanks.

 --
 Travis Crabtree
 Webmaster
 Tusculum College
 phone: 423.636.7300 ext. 5132
 fax: 423.636.7492
 email: [EMAIL PROTECTED]
 __
 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-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/


Re: [css-d] IE7 a display:block issue

2008-02-12 Thread Jim Davis
Visit this site for a solution:

http://www.smileycat.com/miaow/archives/000230.php

Jim

On Feb 11, 2008 11:21 AM, vincent pollard [EMAIL PROTECTED] wrote:

 hi!

 so, i have:

 .headerTwoRight a {
 text-decoration: none;
 display: block;
 height: 42px
 }

 and it displays fine in IE6 and FF but in IE7 the whole area isn't
 clickable, just the Img  P within it (as if it's ignoring display:block).

 however, if i add a background-color to the A it works! but i don't want a
 background-color. anything else i can use other than background-color to
 trigger display:block in IE7?

 Vince
 --


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


Re: [css-d] Disparity

2008-02-11 Thread Jim Davis
Gerry,

I would at least fix the errors having to do with the various table related
tags.

Why not have a go at a tableless design?

Jim

On Feb 11, 2008 6:33 AM, Gerry Goodfriend [EMAIL PROTECTED] wrote:

 Hey Jim, I've put up a copy of that page that does have the doctype
 defined and, unfortunately, it makes no difference. I also know that there
 are other errors, but I thought they'd be of minimal consequence since the
 page displays well enough in the other browsers with them. Thanks.

 Gerry

 [EMAIL PROTECTED]
 www.ckutfolk.com



 On 11-Feb-08, at 9:23 AM, Jim Davis wrote:

 You need to run the page through the html validator (
 http://validator.w3.org/ ). There is no doctype, for example.

 Jim

 On Feb 11, 2008 6:00 AM, Gerry Goodfriend [EMAIL PROTECTED] wrote:

 Hi,

 I'm hoping to get help with a page that displays properly in Safari
 and Firefox on Mac, and Safari and Firefox on Windows, but not
 Internet Explorer 6.0! It looks as if it hasn't been formatted, but
 it has and it displays correctly on each of the other browsers!

 Please go to:

 http://www.bcam.qc.ca/html/contact.html

 and then, under the list that says: Our address is:, click on the
 letter a in Webmaster, and that will take you to the problem page.

 Thanks,

 [EMAIL PROTECTED]
 www.ckutfolk.com

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


Re: [css-d] Disparity

2008-02-11 Thread Jim Davis
You need to run the page through the html validator (
http://validator.w3.org/ ). There is no doctype, for example.

Jim

On Feb 11, 2008 6:00 AM, Gerry Goodfriend [EMAIL PROTECTED] wrote:

 Hi,

 I'm hoping to get help with a page that displays properly in Safari
 and Firefox on Mac, and Safari and Firefox on Windows, but not
 Internet Explorer 6.0! It looks as if it hasn't been formatted, but
 it has and it displays correctly on each of the other browsers!

 Please go to:

 http://www.bcam.qc.ca/html/contact.html

 and then, under the list that says: Our address is:, click on the
 letter a in Webmaster, and that will take you to the problem page.

 Thanks,

 [EMAIL PROTECTED]
 www.ckutfolk.com
__
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/


Re: [css-d] PNG repeating background in IE

2008-02-07 Thread Jim Davis
Karl,

Here is a link that may help. Not sure if this method will work for a
repeating background image.

http://www.belafontecode.com/create-transparent-pngs-in-ie6-using-alphaimageloader-no-hacks/

Jim

On Feb 7, 2008 1:10 AM, Karl Hardisty [EMAIL PROTECTED] wrote:

 I'm back in the fold after a break of 2-3 years, and much has changed.

 Unfortunately, this doesn't include IE5.5 and IE6.  I have a layout
 I'm partial to, and have been experimenting with in the early stages,
 but have come across something I'm not sure how to fix.  I've reduced
 the code down to the bare minimum to show the issue.

 The layout works fine in many browsers apart from the aforementioned,
 due to a transparent PNG being present in the css.  Is there any way
 I can keep the general look and have it work somehow in IE of yore?

 HTML here:  http://mothership.co.nz/reduction/

 css here:  http://mothership.co.nz/reduction/msnew.css

 Any thoughts to get me back on track much appreciated.

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


Re: [css-d] Site check please

2008-02-07 Thread Jim Davis
Bill,

The menu items don't change background color in IE6. The text color does
change. Also, the pop-out for 'Tour Itineraries' is not popping out in IE6.
Not sure of the cause, however.

Jim

On Feb 7, 2008 5:33 AM, Bill Stemp [EMAIL PROTECTED] wrote:

 http://www.pielows.co.za/

 I'm particularly interested in how one section of the site appears in
 IE6 (or before). This section is accessed with the menu link '_*Cape
 Tours*_' and has a CSS-driven menu on the left. I think that this menu's
 background is not correctly aligned in IE6, but cannot be sure.

 Thanks for looking and any help.

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


Re: [css-d] Hover over tabbed selection

2008-02-06 Thread Jim Davis
Aaron,

A number of various drop-down menus are demonstrated here:
http://www.cssplay.co.uk/menus/

If you use Dreamweaver check the offerings for sale by Project Seven here:
http://www.projectseven.com/products/menusystems/index.htm

Also, Project Seven has a good article on accessibility and  menu systems
here:
http://www.projectseven.com/tutorials/accessibility/pop_integrated/index.htm

Jim

On Feb 6, 2008 9:59 AM, Aaron Gray [EMAIL PROTECTED] wrote:

 I am looking for a basic tabbed hover over based content selection
 example.

 Like :-

http://www.authorize.net

 Many thanks in advance,

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


Re: [css-d] What Margin Unit Does IE6 Want?

2008-02-04 Thread Jim Davis
Chris,

You may find it more efficient to zero out the margins etc. then set the
variables to your liking. Thus your chosen rules will apply across all
browser types. Something like:
 h2 {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
}

Then enter h2 again and set the rules to fit your design.

If you want to jump in with both feet read Eric Meyer Reset info here:
http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/

Jim

On Feb 4, 2008 10:50 AM, Chris Akins [EMAIL PROTECTED] wrote:

 Validated page with included styles is here:

 www.springfieldmo.gov/egov/cityclerk/minutes_testHtags.html

 Everything is fine except for the h2 class=description items.  These
 are
 the left hand, called out headers.  They are supposed to line up
 vertically
 with the text to the right of them, which they do everywhere but IE6
 (don't
 have IE7 to test).  Firefox, Safari on Mac are great as well as Firefox on
 PC.



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


Re: [css-d] (no subject)

2008-01-31 Thread Jim Davis
It may be possible to use floats to achieve your objective.

Here is a link to a demo using floats:
http://www.jimdavis.org/test/checkerboard.html

This uses two floats, one that is 16em wide by 8em high, and a blank that is
8em square. The image within the wide float is floated left and is given a
class to set the width and height of the image to 8em by 8em. This makes
sure the image is sized to fit the containing element and allows the image
to change size when the user re-sizes the text in the browser.

I have only tested this on a PC with FF and IE7, so not sure of results in
other browsers and OS's.

Jim

On Jan 31, 2008 10:15 AM, Kenoli Oleari [EMAIL PROTECTED] wrote:

 I am trying to create using CSS to make a page that looks like this:

 http://sfnan.org/iotc/templates-php/pie_1.php

 This page is a series of divs positioned somewhat like a checker
 board.  This page is created by CSS using absolute positioning within
 a div that is positioned relatively.

 For various reasons, I am interested in assembling the checkerboard
 divs using something besides position:absolute



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


Re: [css-d] Presentation vs content issue for interlinear text

2008-01-29 Thread Jim Davis
Have you thought of using a definition list?

dl
   dtOriginal text/dt
ddTranslated text/dd
  dtOriginal text/dt
   ddTranslated text/dd
/dl

You can use css to style the dl dt and dd elements.

Jim

On Jan 29, 2008 10:32 AM, T. R. Valentine [EMAIL PROTECTED] wrote:

 I'm working on a project to display interlinear text (original
 language with a very literal word-by-word translation immediately
 below). The only presentation which my poor imagination can conceive
 is to place each word in a separate cell with the translating word in
 a separate cell immediately below (centring the text in every cell to
 maintain alignment). But this would make searching for phrases (in
 either language) impossible.


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


Re: [css-d] IE Problem with positioning

2008-01-28 Thread Jim Davis
Please include the URL to the page in question. - JD

On Jan 28, 2008 2:44 AM, Lyn Willaims [EMAIL PROTECTED] wrote:


 Hi,

 The following page I created has problems in Internet Explorer. The
 header of the web page shifts right but works fine in all other
 browsers. I can't find a bug fix, does anybody have any suggestions?

 Many Thanks, Lyn Williams
 __
 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-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/


Re: [css-d] Question about wrappers/containers

2008-01-25 Thread Jim Davis
Jason,

If I understand correctly, you are after something that looks sort of like
this example:

http://www.jimdavis.org/test/stainlesstest.html

This uses a background image placed in the body {...}. The image is 2500
pixels wide by 1 pixel high with a center section of black that is 760px
wide. The image is given a position of 50% 0 to make the center of the image
appear in the center of the viewport regardless of the users screen width.

The wrapper is set to 740px wide and margin: 0 auto; to place it inside the
black section and leave a little space around the text.

As a side note, you may not want to base your design on any assumption of
the users screen width. The availability of lower cost wide-screen monitors
means larger numbers of users have screen widths that can be wider than you
may anticipate. My screen width is 1920px, for example, and there seems to
be growing numbers of users with even wider widths.

Jim

On Jan 25, 2008 1:45 AM, J [EMAIL PROTECTED] wrote:

 ... I want no space
 between the graphics and the wrapper.

 This is the current code for the #wrapper ID here:

#wrapper {
background-color:#99;
height:700px;
letter-spacing:-1px;
margin:0pt auto;
position:relative;
text-align:left;
width:760px;
word-spacing:-2px;
}
 ...

 Thanks
 ~Jason
__
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/


Re: [css-d] Multiple Column Lists

2008-01-24 Thread Jim Davis

 Is there any way to change the flow in the browser to vertical, like for
 instance with Chinese text? Or am I dreaming?



Here is a link to information about a JavaScript / CSS3 implementation of
what you are interested in.
http://www.csscripting.com/wiki/index.php?title=Main_Page

Unfortunately, this solution requires a browser that includes the css3
multi-column module, such as Firefox or Opera.

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


Re: [css-d] proportional versus proportional-elastic font-size

2008-01-05 Thread Jim Davis
There is a good discussion of font sizing here:
http://www.alistapart.com/articles/howtosizetextincss

Jim

On Jan 5, 2008 3:55 AM, DAVOUD TOHIDY [EMAIL PROTECTED] wrote:


 Hi,

 Senarios:

 1-body {font-size:X%} and no any other font-size
 declaration for any elements.

 2-body {font-size:X%} and  font-size:Yem for other elements.

 Where X and Y are variables.

 If everything else is the same, which one is better choice for
 a cross browser /platform solution ?

 Pros and cons with DEMO please. and why?

 Thanks for your input.
__
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/


Re: [css-d] A confusing twist on the 3-column layout

2007-12-31 Thread Jim Davis
Matt,

I have done a demo of how I would solve the problem.
http://www.jimdavis.org/variwidth.php

The idea is to create a div that is the width of the photo. The div will
also contain a holder for the icons.

If you don't want to change each page by hand you can write a php script
that will get the width of the image for you.

Jim

On Dec 30, 2007 7:54 PM, Matt Feldman (inthedistance.net) 
[EMAIL PROTECTED] wrote:

 ...Here's an example:

 http://www.mincel.com/gallery/travel_places/paris/IMG_1610.JPG.html

 What I'm trying to do is replicate the display of this photo. Ignore
 everything but the main photo and the navigation bar icons directly
 above and below. I only want to use a lower navigation bar, so this
 becomes like a 3 column layout with header, where the header contains
 the photo and the 3 columns contain those nav 
 buttonshttp://www.evolt.org/help_support_evolt/

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


Re: [css-d] need help on vertical alignement

2007-12-23 Thread Jim Davis
Pat,

When you use height: 100% you have to ask yourself the question what is it
100% of? Since you did not specify the height of the containing element or
the body, the browser can't calculate the height.

Here is an example of two floated divs, with a height of 100%,  inside of a
fixed height container: http://www.jimdavis.org/test/heights.html

This approach would only work if you were certain the content would always
fit vertically within the specified height of the container, or use one of
the overflow rules to deal with the additional content.

To accommodate an unknown height it is common to use the faux columns
technique. Here is an example I did:
http://www.jimdavis.org/test/heights2.html

You can read this for more information:
http://www.alistapart.com/articles/fauxcolumns/

Jim

On Dec 21, 2007 9:03 PM, Patrick Aljord [EMAIL PROTECTED] wrote:

 Hi all,
 I need help for those two divs details and body in my container,
 they don't have the same height and I would like them to have the same
 height. Any way to do this with css?

 here is the page: http://p80.free.fr/testy/dropdown/test.html

 thanks in advance

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


Re: [css-d] CSS simple question?

2007-12-23 Thread Jim Davis
Ernie
Here is a way to do it with a single image that contains two triangles in a
fluid layout.

http://www.jimdavis.org/test/triangles.html

Jim


On Dec 23, 2007 8:44 AM, Ernie Finlay [EMAIL PROTECTED] wrote:


 I can put a right angle triangle on the left side of the container with
 the diagonal facing right,I need a code to put the triangle on the right
 side of the container with the diagonal facing left.
 Thanks,Ernie.
__
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/


Re: [css-d] (no subject)

2007-12-20 Thread Jim Davis
Hi,

The validator is reporting a number of errors in your mark-up. Go to:
http://validator.w3.org/
and enter your URL to see the results of the validation test.

Jim

On Dec 20, 2007 1:33 PM, juliann wheeler [EMAIL PROTECTED] wrote:



 Does anyone know why this page is not picking up the css style sheet like
 the javascrip is telling it to?

 http://www.pcg-advisors.com/new/theteam/brent.html

 It is supposed to look like this one which happens to be working:

 http://www.pcg-advisors.com/new/index.html

 I can't tell why it's working with the home page and not the other one.

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


Re: [css-d] nested lists and absolute positioning and Internet Explorer

2007-12-18 Thread Jim Davis
Patrick,

I created a test page at http://www.jimdavis.org/test/listtest.html using
your css and my html for the nested lists.

According to Eric's book, Cascading Style Sheets 2.0 display: none The
element will generate no boxes at all and thus will neither be displayed nor
impact the layout of the document. Any descendant elements will also be
prevented from appearing, regardless of the value of display for those
elements.

So if my understanding of this definition of display: none is correct then
when ul li ul is set to display: none then it will not be displayed, nor
will any descendants of ul li ul be displayed.

It would appear that IE 6 is getting it right and FF is displaying the
nested lists incorrectly. (GASP!!).

What say the experts on the list?

Jim

On Dec 18, 2007 12:37 PM, Patrick Boutin [EMAIL PROTECTED]
wrote:

 I am able to display this correctly in Firefox but IE6 and IE7 won't
 display the top:property correctly.

 I have 3 nested unordered lists.
 1st one display inline
 2nd one display block
 3rd one display inline

 2nd and 3rd lists only display when container list is hovered and the 2nd
 list has a background image display.

 the li of the 1st list have a position: relative
 the 2nd ul has a position: absolute; left: 11px; top: 10px;

 the top: 10px is perfect in Firefox but for me to get the same
 positioning, I need to change that to 30px.which makes the list be too
 low on Firefox.

 How can I fix this? (this is the actual code) with the actual section I
 mentioned above underlined.
 Everything else seems to display correctly.


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


Re: [css-d] nested lists and absolute positioning and Internet Explorer

2007-12-18 Thread Jim Davis
Thanks Philippe. Haste makes waste, as they say. My apologies to the list
for not taking more care to double check my markup. Corrections made.

Jim




 Your html mark-up is invalid. And what Gecko, WebKit, Opera show is
 correct, given your mark-up.

 http://validator.w3.org/check?uri=http%3A%2F%2Fwww.jimdavis.org%
 2Ftest%2Flisttest.htmlcharset=%28detect+automatically%
 29doctype=Inlinegroup=0ss=1

 Try this:
 http://dev.l-c-n.com/_temp/list.html


 Philippe
 ---
 Philippe Wittenbergh
 http://emps.l-c-n.com




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


Re: [css-d] Nav not positioned right in IE

2007-12-14 Thread Jim Davis
Amy,

It looks like some of the elements that are using absolute positioning are
being positioned relative to the viewport and not the parent div as you
desire. If the parent div is static the absolute positioned div will  seek
the next higher parent that is not static. In this case, the body. Be sure
the containing divs are position: relative; or anything other than static.
It would be best to avoid absolute positioning if possible and have you menu
be part of the flow of the document.

If you find it necessary to use conditional comments to fix IE problems they
should be placed in the html as the last lines just before the /head tag.

Also, an element that you want to center within the parent is usually
written margin: 0 auto; This says there is no top or bottom margin. The
results of using margin: auto; could cause variable results.

Jim

On Dec 14, 2007 6:12 AM, Amy Drayer [EMAIL PROTECTED] wrote:

 Dear CSSers:

 I am about to pull out the gun and shoot myself over this mess.  Any
 and all help GREATLY appreciated.  A note: The invalidation errors
 should not cause this problem (it's a CMS, I cannot fix them).
 Please see:
 http://new.jocohealth.net/
 CSS:
 http://new.jocohealth.net/upload/health/s/gl.css
 http://new.jocohealth.net/upload/health/s/gs.css



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


Re: [css-d] Sidebar issues

2007-12-12 Thread Jim Davis
Todd,

The problem is using position: absolute for the column on the right. See
http://www.w3.org/TR/CSS21/visuren.html#absolute-positioning for more info.

Both of the elements inside the  wrapper should be floated.

Take a look at this demo and view the source to see the css.

http://www.jimdavis.org/test/floaters.html

www.positioniseverything.net has good info about bugs and hacks for using
floats with IE6.

Also check out the List wiki/FAQ -- http://css-discuss.incutio.com/ for more
info and ideas.

Jim

On Dec 12, 2007 1:34 PM, Todd Richards [EMAIL PROTECTED] wrote:

 Hello -

 Regardless of the struggles I have had with CSS, I still find myself
 trying
 more and more.  In all actuality, I probably won't build a site with
 tables
 again!  However, with that said I'm having another issue that I can't seem
 to figure out and I'm hoping the experts here might give it a look.  It
 might be the answer is right in front of me but I've been looking at it
 too
 long.

 I'm working on a new site and have a right-hand sidebar for misc content.
 The problem I have is that if the main content window is not full of
 content
 (or more content than the sidebar), the sidebar flows down the page, over
 the footer, etc.  Besides looking awful, it's not acceptable!  It happens
 in
 Firefox, IE, etc.

 The development site is at:  http://obb.danstuenzi.com. I have included
 the
 CSS below if anyone has any thoughts on this.

 Thanks!

 Todd


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


Re: [css-d] Site test

2007-12-12 Thread Jim Davis
In both FF and IE6 the nav menu breaks across two lines when the viewport is
set to 1024px wide. The 'contact' image is below the 'home' image. Changing
the padding on the li to 2% keeps everything on one line at 1024 wide.

To center the menu you can give a width to the ul that accommodates the all
of the li's, then center the ul with margin: 0 auto;

Jim

On Dec 12, 2007 3:51 PM, Mike Smith [EMAIL PROTECTED] wrote:

 Hello all.

 First time poster.

 Just wondering if I could get a site check on this temp site:

 http://www.grum.com/temp/al/index.html

 I managed the HTML/CSS, not the graphics, so I'm looking to see what, if
 anything, breaks (I know the h1 in the banner does on increased
 font-sizes).

 Also would like to know what can be done about centering the menu better.

 Finally, I've tested in FF 2.0.0.11 and IE 6 on Win2K Pro. All seems to
 display as it should... anyone having issues with other browsers/OS are
 encouraged to reply.

 Thanks in advance,

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


Re: [css-d] Fwd: Horizontal scrollbar in IE7

2007-12-11 Thread Jim Davis
Looking at your page with IE6, which also shows the horizontal scroll bar,
it looks like your wrapper div is a child of FORM id=aspnetFORM which has
no width, height, or margins. Setting #aspnetFORM to width: 920px; margin: 0
auto;  removes the h-scroll bar in IE6.

Jim

On Dec 11, 2007 12:41 AM, Eystein Alnaes [EMAIL PROTECTED] wrote:

 I don't think this email went through yesterday, so I'm giving it another
 shot.

 http://edb.episerverhotell.net/no/Referanser/

 On these pages only IE7 gets an undesired horizontal scrollbar. It is not
 the italics/float right bug, so what is it?
 Before anyone tells me to validate it, that is beyond possible. What we're
 dealing with here is EPIserver 5, and a lot of people involved. Just me on
 the CSS though.

 Regards,
 Eystein
__
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/


Re: [css-d] site check IE 6

2007-12-10 Thread Jim Davis
You need to add height: 1%; to the sixvillageslogo div and IE6 will be
happy.

Jim

On Dec 10, 2007 11:26 AM, Bryan Hepworth [EMAIL PROTECTED] wrote:

 Hi

 I'd be grateful if someone could check IE6 behaviour with my main page.
 I've looked at several rendering pages with mixed results the worst
 crunching the graphic image at the top.

 Page is here: -

 http://www.sixvillages.co.uk

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


Re: [css-d] Site check

2007-12-08 Thread Jim Davis
Scott,

The site looks good, but I'm seeing a horizontal scroll bar when I set the
view port to 1024 px wide. in FF/win and IE6.  Also see the horizontal
scroll bar in IE6 with the view port set at 1920 wide. It may be the
margin-left setting on the sidebar ul. Looks like it is forcing the ul too
far to the right.

Jim



On Dec 8, 2007 11:34 AM, Scott Demontluzin  [EMAIL PROTECTED]
wrote:

 Hi List,
 I've been meaning to jump in for a while.I'm working on my first website
 http://www.scottdemontluzin.com/
 I'm using the dreaded 'Holy Grail' layout and it seems to be working ok.
 Any
 criticisms will be greatly
 appreciated.
 Thanks Scott

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


Re: [css-d] How to achieve this effect

2007-12-07 Thread Jim Davis
They are using JavaScript to manipulate the DOM (Document Object Model). In
this case they are changing class of a div from display: none; to display:
inline.

Off topic for this list.

Jim

On Dec 7, 2007 11:26 AM, Brian Jones [EMAIL PROTECTED] wrote:

 Can someone please tell how i can achieve this effect?

 http://www.concept64.com/portfolio/

 The ids for each client have display:none. But when you click on the
 next and prev buttons it moves through the ids and display the content
 in the divs.
 How are they doing this?

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


Re: [css-d] Missing Background Image in Firefox

2007-11-30 Thread Jim Davis
To #Wrapper add the rule display: table;   -- this will cause the wrapper to
expand vertically to the height of the content of the div.

Jim

On Nov 30, 2007 7:27 AM, Snipes, Jason L [EMAIL PROTECTED] wrote:

 One of my developers just asked me for help with why a background image
 is not appearing in Firefox.  I'm not sure how we missed it before (just
 poor checking on my part primarily) but for some reason today my brain
 is broken and I cannot seem to figure it out.

 http://www.forsythcomputertraining.org/default.aspx

 The image is only used on the home page and the developer decided to
 place the css inline.  Here is the snipped html showing the main
 containers, the content has been removed to save space:



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


Re: [css-d] Site check needed...

2007-11-29 Thread Jim Davis
Keith,

There is a problem with the left and right menus in IE 6 at 1024 X 768. See
a screen shot here: http://www.jimdavis.org/test/bsaScreenshot.jpg

I suspect the problem is in this rule:.LsideMenu, .RsideMenu {
padding-left:6%; }. I would get rid of that and set the left and right menu
ul to margin: 0; padding: 0;

That would be a start in the right direction.

Jim


On Nov 29, 2007 2:06 PM, Keith Kaiser [EMAIL PROTECTED] wrote:

 Please visit http://bsaroundtable.com/index2.php and give me your honest
 opinions. The CSS of importance here is at;
 http://bsaroundtable.com/css/rtstyle2.css

 Be sure to click through several of the left menu items, the most
 problematic for me was the 'Cub Scut, Boy Scout  Venturing' item, making
 it
 fit was a problem.

 Please give me specific ideas how to improve the layout, don't just say
 make
 the center column bigger, tell me how.

 Thanks to all...

 --
 YIS/YIV/73's!
 Keith D Kaiser
 nearspaceventures.com
 bsaroundtable.com
 kaiserklan.com
 __
 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-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/


Re: [css-d] floated image is offset in Firefox only; why?

2007-11-29 Thread Jim Davis
You have the logo image wrapped in an h1 tag.

h1a href=/index.htmlimg src=../_img/page/logo-CaledoniaStudios.gif
alt=Caledonia Studios -- making history one piece at a time... width=463
height=62 //a/h1

Try removing the h1

Jim

On Nov 29, 2007 7:03 PM, Matt Jalbert [EMAIL PROTECTED] wrote:

 On this page:
 http://www.sparklejet.com/clients/cale/livingroom/

 the logo, which is in a float-left div, renders in Firefox (both Mac
 and Windows) exactly 17 pixels below where it should be. That is, the
 float seems to be in the right place in Firefox, but the image in the
 float -- the GIF logo with a transparent background --  is offset 17
 pixels down. I have made the background of the float red to emphasize
 the offending offset (it looks terrible at the moment).

 It renders fine in Safari, Explorer 6 and 7.

 CSS is here:
 http://www.sparklejet.com/clients/cale/_css/style.css

 Any advice on how I can modify my coding of HTML/CSS to get the logo
 to eliminate the image offset in Firefox? What am I doing wrong?

 I have tried to keep my code as clean as I could, and I generally
 avoid overly-sophisticated hacks.

 Thank you in advance for any help.http://www.evolt.org/help_support_evolt/

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


Re: [css-d] FW: vertical-align middle NOT in tables (was: problem w/ table-less horizontal nav bar)

2007-11-28 Thread Jim Davis
Rob,

Here is one solution:

In body {...} change the font-size to an em value such as 1em (more on this
later).

Then change to:
ul#navbarUl {
clear: both;
height: 20px;
width: 100%;
margin: 0;
padding: 13px 0;
background-image: url(images/navbar-bg.jpg);
background-repeat: no-repeat;
}
li.navlink {
float : left;
width : 20%;
list-style-type : none;
text-align: center;
}
li.navlink a {
color: white;
text-decoration: none;
font-size: 1em;
letter-spacing: 1px;
margin: 0;
padding: 0;
}

You should also remove the br from News and Seminars and consider
replacing the word 'and' with amp; (ampersand). It still may break into two
lines.

This works in FF win. Not sure about the evil IE.

But there is a bigger issue. If you set font-size to *n* pixels then IE,
including IE 7, will not re-size the font if the user selects a desired Text
Size  in the browser.  Since your content states ...serving the unique
needs of people 50 and older you should consider the possibility that users
with less than perfect eyesight will view a larger font size via the browser
options. This possibility creates havoc with the nav menu, among other
things.

You may need to think about changing the width of the site to 960px, or so,
to give you additional horizontal space for the nav menu and other columns.

Jim




 Now here's my next *newb* question... If I have a horizontal nav bar
 comprised of LI elements, where the lines of text varies from one LI to
 another, how do I get them to vertically center align.

 The old link that was broken is now fixed again with a partial
 implementation of David's LI treatment. The LI's use text, not graphics
 for
 the a elements.

 http://rob.emenecker.com/eclasses/H152/posts/wk3-new/wk3new.htm

 ...Rob

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


Re: [css-d] problem w/ table-less horizontal nav bar

2007-11-27 Thread Jim Davis
Rob,

No specific fix for you, but some resources to consider:

List Tutorial and examples:
http://css.maxdesign.com.au/index.htm

Using a single image and css background-position to change the display on
hover:
http://css-tricks.com/css-sprites-what-they-are-why-theyre-cool-and-how-to-use-them/

hth,
Jim

On Nov 27, 2007 9:41 AM, Rob Emenecker [EMAIL PROTECTED]
wrote:


 First, the page...
 http://rob.emenecker.com/eclasses/H152/posts/wk3-new/wk3new.htm

 Next, the current CSS...
 http://rob.emenecker.com/eclasses/H152/posts/wk3-new/carolgay.css

 Now, the problems...

 #1 Excess whitespace between aimg/a elements in Horizontal Nav Bar

 http://rob.emenecker.com/eclasses/H152/posts/wk3-original/wk3old.htm

 #2 Excess vertical whitespace between the header DIV and the navbar
 DIV
 in IE6.

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


Re: [css-d] site check please..

2007-11-25 Thread Jim Davis
Looks like it breaks in IE6 win. See screen shot here:
http://www.jimdavis.org/test/ie6.jpg

You can see how you site will render in different browsers and os's for free
here:
http://browsershots.org/

Jim

On Nov 25, 2007 10:34 AM, Rob freeman [EMAIL PROTECTED] wrote:

 Hello everyone, I have been working on a little
 site for some friends which I have just uploaded.
 Could anyone please check the site in older browsers
 For any problems (its not complete).

 I have workied in OSX running firefox and safari.

 http://www.precociouscollective.com/artists.html

 this page has a few floats, which Im a little worried about
 in older browsers.

 Thanks.

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


Re: [css-d] update, can you check this site now

2007-11-25 Thread Jim Davis
Looks good in IE6 win now.

Jim

On Nov 25, 2007 11:03 AM, Rob freeman [EMAIL PROTECTED] wrote:

 http://www.precociouscollective.com/

 --
 Rob Freeman
 [EMAIL PROTECTED]
 __
 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-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/


Re: [css-d] Breadcrumbs wrapping and background image IE6

2007-11-21 Thread Jim Davis
I don't want to ignite the old debate about using a definition list for a
list of links, but perhaps this is one of those cases where using dl and
dt could be employed. Note the following demo:

http://www.jimdavis.org/test/bcTest.html

The dt can be styled with a background image and floated left. Set margins
to suit your taste.

Jim

On Nov 21, 2007 3:03 AM, Rees, Mark [EMAIL PROTECTED] wrote:

 Hello

 I have a breadcrumb which wraps over two lines. I'd like to have an arrow
 appear to the left of each link in the breadcrumb, and I'd like preferably
 to split links over two lines where necessary, or alternatively to have
 breadcrumbs appear whole on the new line where they would otherwise be
 split. I cannot make either option work in Internet Explorer 6.
__
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/


Re: [css-d] firefox css problem

2007-11-19 Thread Jim Davis
Looks to me like the image of the shark in the footer is forcing the nav
menu below the footer into the dark area of the page. You may need to remove
the photo of the shark, or add height to the footer.

Jim

On Nov 19, 2007 11:46 AM, jaklitsch maya [EMAIL PROTECTED] wrote:

 I have run into a problem with firefox that I just do
 not know how to solve.

 IE6 displays it just fine. I thought that IE7 and
 firefox did also. Just found out yesterday that I was
 wrong. I did validate the html code and css, am using
 html strict. The only difference with xhtml is that am
 not using br /. But will switch to xhtml if it will
 solve this.

 http://www.necwa.org/new_site/index.html

 http://www.necwa.org/new_site/necwa.css

 The problem is that the bottom of the page will not
 display correctly in FF. I do not know how to correct
 this.

 Am getting desperate as the site has to be finished by
 Thursday.

 Thanks,

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


Re: [css-d] problem with Zeitgeist Joomla template

2007-11-09 Thread Jim Davis
Do you have a URL so we can see the problem in real time?

On Nov 9, 2007 1:16 PM, mona borham [EMAIL PROTECTED] wrote:

 Hey guys,
  I've a big problem here with the new menu created by this
 template that the menu items not showing up because of it's css...
__
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] Layout problem in Mac/Safari

2007-11-08 Thread Jim Davis
My site will render properly in Mac/Firefox, however it breaks in
Mac/Safari.

Mac/Safari screenshot:
http://browsershots.org/png/original/d4/d442e5566aaaf7f675b1ab995b024ce1.png

Mac/Firefox screenshot:
http://browsershots.org/png/original/78/781379f3cfc6de1761ac4dcb917c4817.png

In Safari the content div, which contains float: left and float: right divs,
is not obeying the margin: 0 auto; rule to position the div in the center of
the screen. In addition, the nav menu that should be below the header is
being place below the content div, completely out of the flow. I have placed
clearing divs all over as I understand floats can induce problems in Safari.

I have had problems in the past with Safari and nested divs, so I have
intentionally removed the wrapper div from this design and set all the
parent divs to margin: 0 auto;.

Live web site can be viewed here: http://www.dsignerclumber.com

Any ideas?

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


Re: [css-d] Float problem

2007-11-08 Thread Jim Davis
Vicki,

Adding the rule display: table; to the ufwus div will fix the float problem
in Firefox. As I view the site in IE 6, however, there appears to be major
problems. I will send you a screen shot off the list.

Jim

On Nov 8, 2007 2:15 PM, Vicki Stebbins [EMAIL PROTECTED] wrote:

 Hi Everyone,

 I'm almost there with this page
 http://www.keenstreet-dev.com/trying.html but the floated box on the
 right keeps going to the bottom of the 'ufwus div' instead of the top
 and then having the text wrap.


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


Re: [css-d] Targeting DIV question

2006-04-06 Thread Jim Davis
I agree with Zoe. Just because it can be done with CSS, does not mean it
should be done. Replacing and image on a page is a job better done with CSS
in concert with JavaScript and the DOM.

For an excellent primer on the subject see DOM Scripting: Web Design with
JavaScript and the Document Object Model by Jeremy Keith,
http://www.domscripting.com/.

The Project Seven website also has a good tutorial on accessibility at:
http://www.projectseven.com/tutorials/accessibility/pop_integrated/index.htm

Be sure to visit the example site at :
http://www.projectseven.com/tutorials/accessibility/pop_integrated/pmmsite/index.htm

Note how the example site, with a fly out menu, can be navigated without the
use of the mouse. Good stuff.

Jim





  While Stu Nicholls demos are amazing examples of what CSS can do, they
  are not good practical solutions in many cases. This, IMO, is one of
  those cases. This thing is very hard to use, even for a young person
  with good motor skills and an expectation of what I will see when I
  hover and a strong familiarity with all things web. Please, please don't
  use it in real life. Use Javascript for this sort of thing, or even
  better, just create separate pages and link them together.
 
  Zoe

 I don't understand. How is this any less usable than the thousands of
 fly-out menus all
 over the web? Not that I'm interested in using it... just curious.

 b


__
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] Rounded corners and Transparent GIFs

2006-03-23 Thread Jim Davis
See this site for a css + js solution to rounded corners with transparent
capability.

http://pro.html.it/niftycube/

Jim

On 3/23/06, Michael Clayton [EMAIL PROTECTED] wrote:

 For my next trick, I'll need a div with rounded corners on top of a
 textured background.  Any volunteers from the audience?
__
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 Positioning Question

2006-03-08 Thread Jim Davis
Ramone,

Here is a link that shows a way to fix the position of both the header and
footer. You can adapt this to fix the position of the footer only.

http://www.456bereastreet.com/lab/cssframes/

HTH,
Jim

On 3/8/06, Ramone Kalsaw [EMAIL PROTECTED] wrote:

 Is there a css scheme for positioning div id=footer so that it will
 lay
 at the absolute bottom of the page, with every other element above it?



__
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] Getting rid of IE positioning Hacks

2006-02-26 Thread Jim Davis
Ryan,

Try putting the IE hack in a conditional comment:

!--[if LTE IE 6]
style
#ul-nav { margin-top:-40px;}
/style
![endif]--

Place this just prioir to /head. The validator ignores anything inside the
comments. You will need the code on every page or set it up as an include.

For more on conditional comments go to microsoft.com and search for
'conditional comment'.

Jim



On 2/26/06, Ryan Morris [EMAIL PROTECTED] wrote:

 Hello,

 I am trying to avoid using IE hacks as much as possible - especially ones
 that result in 'invalid' css.

 I have this menu/submenu
 http://menutest.mnos.org/test.php

 This works fine in IE  Firefox - however, it's working ok in IE because
 it
 has a position hack applied to it in the css (hp_nav.css)

 #ul-nav{
 *margin-top:-40px;
 }

 If i remove this, see example
 http://menutest.mnos.org/test_nogoodinie.php

 Is there any way to position this Menu (#ul-nav) correctly without relying
 on an invalidating position hack?

__
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] how could I center a div layer

2006-02-21 Thread Jim Davis
Lorenzo,

Visit this demo for inspiration:

http://www.456bereastreet.com/lab/cssframes/

Jim

On 2/21/06, Lorenzo Giuliani [EMAIL PROTECTED] wrote:

 Hi, I'm trying to center a relative position div. What could I do?

 here is the CSS:

 div.footer {
 width : 720px;
 margin-left : auto;
 margin-right : auto;
 position : fixed;
 z-index : 1;
 bottom : 0px;
 text-align : center;
   }

 This is the XHTML:
 ...
 div class=footerFooter/div
 ...

 this div should be centered and attached to the bottom border.


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

2006-02-20 Thread Jim Davis
Schalk,

Re-sizing text presents problems. Look at the design in FF  Win and press
control+ and you will see a page that  renders similar to  what you see in
Opera. Perhaps sizing the menu elements in em's may help.

I  would be interested in any feedback you get as a result of your fixed
width design that is greater than 800px wide. I instruct a how to use your
computer class for real estate agents and a majority of these users keep
their screens set to 800px wide. Many also set IE to the large text size.

Jim

On 2/20/06, Schalk [EMAIL PROTECTED] wrote:

 Greetings All,

 Please have a look at the following pages:
 http://www.volume4.com/fc/index.html
 http://www.volume4.com/fc/entry_archive.html

 Let me know any problems you run into. I know IE6 has some bugs, the
 strangest for though is what happens in Opera. 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/


Re: [css-d] Image -- text -- image

2006-01-19 Thread Jim Davis
Keith,

Here is a link to a three column grid demo created by Al Sparber:

http://www.projectseven.com/csslab/testing/lists/grid.htm

It's a fixed width, but maybe will provide some inspiration.

Jim

On 1/19/06, Keith Kaiser [EMAIL PROTECTED] wrote:

 I want to put text between two images,

 .
 div id=wrapper
   img src=. width= 
 Some kind of text herebr
 with a a href=  too
   img src=. width= 
 /div
 

 I would like it to be fluid so that spacing happens by default and the
 entire thing is already in my main content div set...
__
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] Site Check - Internet Explorer (Win)

2005-12-27 Thread Jim Davis
Hi,

IE 6 using XP is forcing the right column down below the main content.
Screenshot available on request.

Jim

On 12/27/05, Richard Brown [EMAIL PROTECTED] wrote:

 Hi Guys

 Could someone please take a look at this site in WinIE? I have given
 the wrap a background image and I am hoping it works in IE. Basically I
 am trying new ideas



__
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] trick for fixed positioning in IE?

2005-11-27 Thread Jim Davis
Curby,

Eric has a demo of fixed position backgrounds here:
http://www.meyerweb.com/eric/css/edge/complexspiral/demo.html

IE will accept a fixed position background as part of the body. In Eric's
example it is:

body {background: black url(shell-bg.jpg) 0 0 no-repeat fixed;}

Jim

On 11/26/05, curby . [EMAIL PROTECTED] wrote:

 I'm trying to get a floating logo to work on this elastic jello page:

 http://curby.net/doc/jello-new.html

 It works in recent Geckos and Safari, but not IE.

__
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] background image not showing in FF

2005-11-25 Thread Jim Davis
Hi,

In #canvas add display: table.

Jim

On 11/25/05, Nick Wilsdon [EMAIL PROTECTED] wrote:

 First post to the list so hello everyone -


 I'm having some trouble making my background image (bg-canvas.gif) appear
 in
 this layout when viewed in FF. No problem in IE.

 http://www.e3internet.com/clients/lenzone/shop/lenzoneTEST.htm




__
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] Text decoration help

2005-11-25 Thread Jim Davis
Angus,

Try CSS something like..

.shout-it { font-weight: 900; text-decoration: underline; }

Then html like:

p class=shout-itThis is bold underline/p

Using em as a class or id name is probably a bad idea.

Jim

On 11/25/05, Angus at InfoForce Services [EMAIL PROTECTED]
wrote:

 In my style sheet, I have:

 em {
 font-weight: 900;
 text-decoration: underline;
 }

 And the text between the em/em appears as bold italic and not bold
 underline. Anyone now why?



__
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] Undesired image border

2005-11-24 Thread Jim Davis
Hi,

Add this to your CSS:

#logo img { border: 0; }

Jim

On 11/24/05, Mário Gamito [EMAIL PROTECTED] wrote:

 Hi,

 I'm prototyping this new web site, using as far as possible CSS.

 If you care to take a look at
 http://www.dte.ua.pt/~gamito/prototype.php
 you'll notice that Fig.1 has a blue border around it (Fig. 2 doesn't, i
 don't know why).

 Well, of course that if i insert border=0 in the img tag, the border
 disappears, but i want to do it on the CSS side.
 In CSS's #logo definition i've already tried border=0px, border: none,
 but without success.

 So, my question is: how can i make the blue border disappear acting on
 the CSS ?



__
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] i am lost on how to do this in css

2005-11-14 Thread Jim Davis
Jon,

Here is a demo of an approach that uses a single div:
http://www.jimdavis.org/multifloats.htm
This example assumes all of the main images are the same size.
I haven't applied any IE fixes that may be required but it seems to
work in IE 6 and FF/win.

Jim

On 11/14/05, Jon Stephenson [EMAIL PROTECTED] wrote:
... have gotten everything working
 except for the product page. I have played with making little div boxes
 and then with a float left on them and it works well enough but I am
 still having to put tables in the div boxes. Here is an example of one
 of the pages I am trying to recreate
 http://www.flora-rose.com/category.asp?rcid=3389.
__
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] layout does not work the same in NS and IE

2005-11-09 Thread Jim Davis
Thomas,

The to fix the IE double margin bug, in your block_1 div change
display: block (which is not needed) to display: inline.

To read more about this bug and many others read everything at:
http://www.positioniseverything.net/

and on the wiki for this list:  http://css-discuss.incutio.com/

Jim

On 11/9/05, Thomas French [EMAIL PROTECTED] wrote:
 I am new to CSS and am having trouble getting css to work consistently in
 different browsers.

 http://pws.cablespeed.com/~tom.french/example1.html
__
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] Pop Menu Magic but want to use images

2005-11-06 Thread Jim Davis
Joanne,

I have found PVII to offer excellent support of their products. Visit
their support page at http://www.projectseven.com/support/index.htm
and you will find information about their newsgroup discussion forums
and other support options.

Some of the POP Menu Magic optional menus use images for backgrounds
so it should not be too difficult to replace the stock background
with your own image.

Jim

On 11/6/05, Joanne [EMAIL PROTECTED] wrote:
 I purchased the POP Menu Magic from PVII today and saved myself oodles of
 time creating a menu for a site I was creating. I need to use it on another
 site soon but the initial links in the navigation are actually images and
 I'd like to keep them that way if at all possible.

 How do I get around that?
__
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] div problems

2005-10-30 Thread Jim Davis
Hard to tell without some code to look at.

Be sure the containing div is not static. The containing div should
include something like:

{...position: relative...} for example.

Jim

On 10/30/05, meeester kode [EMAIL PROTECTED] wrote:
 I cant seem to get div to work while trying to use
 absolute positioning.

 Im readin two css books right now core css and css
 web design for dummies and both have code snippets
 for this and it doesnt work right for me in firefox or
 ie6! wtf is going on? TIA, mrk0de
__
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] changing the distance between paragraphs

2005-10-17 Thread Jim Davis
Ross,

You can also set all p tags within a class or ID.

#content {...}
#content p { padding: .5em 1em; ...}

This will set the rules for any p that is contained in the #content
div, thus saving having to add a class name to every p within the
div.

Jim

On 10/17/05, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote:
 Can I set up custom paragraph heights that do not effect the normal P tag?
__
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] IE Fix Needed

2005-10-12 Thread Jim Davis
For the first two problems try adding:

a {display: block; background-color: #CC;}
a:hover {color:black; background-color: white;}

Change colors to suit.
Jim

On 10/12/05, Rahul Gonsalves [EMAIL PROTECTED] wrote:

 Dear All:

 I'm having a couple of problems with a page in IE.

 The page in question:
 http://janaagraha.org/rahul/John/

 Mockup - What I'm trying to achieve: (warning: 100kb)
 http://www.flickr.com/photo_zoom.gne?id=51803913size=o

 Problems:
 1. I would like the navigation text to have grey padding, similiar to
 the way it is in the mockup.
 2. I'd like the background colour to change on a:hover to another colour.



__
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] LI's Line Up in IE but not FF

2005-10-07 Thread Jim Davis
Thomas,

Since you are not using individual images for your icons it may be difficult
to ever get the adjacent text to align across all browsers using margins,
padding and line-height. I would use an individual image for each icon and
place each icon and related text in a div. This will also allow you to use
the icon as a link. An alternative would be to absolutly position a unique
div for each link See http://www.alistapart.com/articles/imagemap for more
information.

Jim


On 10/7/05, Thomas Hall [EMAIL PROTECTED] wrote:

 Appreciate any help on this. This page -
 http://www.dolphincoveinn.com/manzanillo-tourism-attractions.asp has a
 list
 of links for various pages in the site. I set a background on the UL with
 icons (you will see) but in IE they line up perfectly but on Firefox the
 alignment is off. I have played with the margins and paddings on the
 list-items but to not success.
__
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] Anyway to get rid of the horizontal scrollbar at the bottom of a div?

2005-10-03 Thread Jim Davis
Rick,

Try placing the div with overflow: scroll inside of a div with overflow:
hidden. Adjust the height of the containing div to less than the height of
the inner div. See this example:
http://www.jimdavis.org/test/scrolltext.htm

Jim

On 10/3/05, Rick Faircloth [EMAIL PROTECTED] wrote:


 I want to keep the vertical scrollbar, but get ride of the horizontal
 scrollbar...


__
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] Solution for broken CSS in IE4?

2005-09-25 Thread Jim Davis
Edith,

Here is a link to a source for browser compatibility charts.

http://www.westciv.com/style_master/academy/browser_support/index.html

Perhaps this would be a good place to start.

Jim

On 9/25/05, Edith Karnitsch @ Terranetwork [EMAIL PROTECTED]
wrote:


  Just downloaded a stand-alone IE4 version though and it's
 totally broken. My tabbed list navigation is broken, the floats are broken
 -
 in short, the site looks a mess

 work-in-progress is here: 
 www.terranetwork.net/terra05/web_hosting_1.phphttp://www.terranetwork.net/terra05/web_hosting_1.php
 and another page is here: 
 www.terranetwork.net/terra05/oscommerce_7.phphttp://www.terranetwork.net/terra05/oscommerce_7.php



__
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] Centered Layout + attached to left edge. Possible with CSS at all?

2005-09-23 Thread Jim Davis
Kevin,

The rows will go flush to the left and right if the borders are removed and
the width is changed from 99.8% to 100%. Perhaps I don't understand you
design objective.

Jim

On 9/23/05, Kevin Cannon [EMAIL PROTECTED] wrote:

 Hi Jim,

 That's almost there. The challenge i'm facing is how to get the rows to go
 flush to the left edge. What you've done there has got everything spot on
 up
 to that point. Do you think there's any way to persuade the those rows, to
 go
 flush to the left edge?

 Cheers,

 - Kevin

 On Fri, Sep 23, 2005 at 06:33:25AM -0700, Jim Davis wrote:
  Kevin,
 
  Here is my approach:
  http://www.jimdavis.org/test/locked_left.htm
 
  View source to see the css.
 
  Note that a 100% wide div with borders left and right will force a
  horizontal scroll bar in FF and IE 6 in standards mode. Thus the need
 for
  slightly less than 100% width if borders are used.



__
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] href's and images

2005-09-21 Thread Jim Davis
Sam,

There is an interesting article at
http://alistapart.com/articles/imagemap/that takes the old html image
map concept and adapts it to the modern world
of CSS. The idea is to use a single image for your menu and place absolutely
positioned div's over each menu item. Worth a look.

Jim

On 9/20/05, Sam Leathers [EMAIL PROTECTED] wrote:

 I'm working on a website where I have a standard ul list for links in
 display: block; Currently, the links are img tags, but I'd like to use
 css to display the image. I know I can use background:
 url(/path/to/image.gif), but whats the best way to have a different
 image for each href? Do I need to have each href in a different class to
 achieve this? Also, if it makes any difference, I do plan on using the
 hover tag to do an image swap.

 URL: http://irc.gentux.org:8000/Contact-pg.html



__
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] Type Tester Tool for CSS

2005-09-19 Thread Jim Davis
Listers may be interested in a type testing tool available in beta at:
http://typetester.maratz.com/
You can set virtually every CSS variable having to do with type, compare 
styles side by side, and generate the CSS needed to create the style on your 
page.
Good stuff.
Jim
__
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] IE6/Win table box model padding issue

2005-09-19 Thread Jim Davis
My apologies, the doc type info in my previous post was an image, not text. 
The text should be:

!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN
http://www.w3.org/TR/html4/loose.dtd;

Jim
__
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] Help with positioning...

2005-09-19 Thread Jim Davis
Athreya,

In #container add the rule display:table. 

Jim

On 9/19/05, Athreya Chidambi [EMAIL PROTECTED] wrote:
 
 Hi,
 Can anyone tell me why the footer on this page for
 some reason is showing up under the search bar in
 firefox? Looks fine in IE.
 
 url:http://www.athreyachidambi.com/test/meil/profile.html
 css:http://www.athreyachidambi.com/test/meil/mainstyle.css
 
 thanks
 A.
 
 

__
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] IE expanding Box Problem

2005-09-14 Thread Jim Davis
Benny,

To the inner div, add line-height: 1px;

Jim

On 9/13/05, benny [EMAIL PROTECTED] wrote:
 
 Hello,
 
 i'm new to this list and have a IE box problem.
 following example shows what i mean:
 
 div style=border:3px solid red;height:50px;background:#eee
 div style=border:1px dotted green;height:1px;/div
 /div
 
 if i give the inner DIV a height, the IE expand this inner DIV about 12px. 
 also a height:0px; will do this. i just need 5px, how can i get this 
 height? erasing the height style will minimize the height to 0, only the 
 border appears.
 i read the Internet Explorer and the Expanding Box Problem but found no 
 solution of my height problem. maybe i read to fast or forgot some basics. 
 i'll read again but maybe one of you css-users can give a hint.
 
 

__
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] Synchronising independent 'columns'

2005-09-12 Thread Jim Davis
Ken,

Here is a demo I cooked up that is one possible approach to your design.

http://www.jimdavis.org/test/test1.htm

This design uses an image in the body for the left column (not an original 
idea, btw).

Works in FF and IE PC. Will need to have an exception to correct the IE 5 
box model (see http://www.projectseven.com/csslab/boxmodel/ )

hth,
Jim 

On 9/12/05, Rodent of Unusual Size [EMAIL PROTECTED] wrote:
 
 
 I have a page with a background that provides a visual sidebar
 that I need to honour using CSS. I need to be able to put
 elements into the sidebar and onto the main portion of the
 page, and occasionally vertically align elements in both.
 
 Another description, complete with some pictures, is at
 http://ken.coar.org/burrow/index.html?entry=1568
 
 Is this possible? If so, can/will someone point me to
 something describing how to do it?
 
 

__
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] Unwanted whitespace - please advise...

2005-09-10 Thread Jim Davis
Ian,

The white space above the footer seems to be caused by the #clear {...} 
rule. Try removing #clear from the css and adding clear: both; to #footer. 
As a side note, it is probably a good idea to avoid using property names, 
such as clear, as an id or class name.

Jim

On 9/10/05, Ian Piper [EMAIL PROTECTED] wrote:
 
 ...It seems to work fairly well apart from some unwanted white
 space. If you have a look at this you should see the problem:
 
 http://www.tellura.co.uk/gtpr/
 
 In Safari it looks OK apart from about 10 pixels of white above the
 footer. In IE this white space is also visible, but there is also
 about 2 pixels of white space above and below the banner (the top
 half of the sunflower picture).
 
 

__
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] Vertically top aligning bugged vertically centered text

2005-09-10 Thread Jim Davis
Peter,

It appears that you are trying to achieve a 2 column fluid design with a 
header. You would also like the left and right columns to extend to the 
bottom of the viewport regardless of the content within the columns. There 
are a number of resources that offer free examples of various types of 
layouts that will help you learn different methods of achieving your 
objective.

A good place to start is the wiki for this list: 
http://css-discuss.incutio.com/
You should also study the demos available at 
http://www.positioniseverything.net

Two of my favorite resources are:
http://wellstyled.com/css-2col-fluid-layout.html
and
http://www.projectseven.com/tutorials/css/pvii_columns/index.htm

Hope this info helps,

Jim 

On 9/10/05, Peter Frederiksen [EMAIL PROTECTED] wrote:
 
 Me:
 A newbie who had his first glance at HTML a week ago and in the mean time 
 has looked at the HTML- and CSS-docs of two sites in adherence to the 
 LBD-principle. And no: I'm not stealing anyone's design or ideas and the two 
 sites are going to be credited.
 
 
 What I want (background colors set for testing purposes):
 Header Menu:
 From top left corner to top right corner of screen
 Background color: Green
 Side Menu:
 From top left corner to bottom left corner of screen
 Background color: Black
 Main area:
 The rest
 Background color: White
 (Body test color: yellow)
 [snip]

__
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] IE - Clickable transparent link?

2005-09-05 Thread Jim Davis
Oliver,

I hope someone on the list has a more elegant solution than mine. Here is a 
link to a demo of a solution that uses a transparent image to achieve the 
objective. The .gif image is sized the same as the link area. In this case 
200px square. Seems to work in FF and IE6 PC.

http://www.jimdavis.org/test/hovertest.htm

Jim

On 9/5/05, Oliver Hodgson [EMAIL PROTECTED] wrote:
 
 Hi,
 
 I'm making a new front-page for a website, and marketing have decided that 
 they want a large area to be clickable. This area contains multiple headings 
 and paragraphs, so wrapping the whole thing in an a element is 
 impractical.
 
 To achieve this, I'm using an absolutely positioned and sized a element 
 within the parent div.
 
 This works fine in Firefox. However, in IE6, I am unable to click the link 
 wherever it intersects with another of the parent div's children, *unless* 
 it has a background colour (hence wiping out all of the content below).
 
 I've created a simple test case, so you can see what I mean:
 
 http://thinkdrastic.net/journal/wp-content/fullsize_link.html
 
 (Link on the left (with a border) is broken in IE, solid link on the right 
 works).
 
 I've checked that hasLayout='true', so that's not the issue here. I think 
 it's just IE6 being a numpty. Can anybody think of a way to make all of the 
 link clickable in IE?
 
 Thanks in advance,
 

__
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] left/right borders on master div problem

2005-09-03 Thread Jim Davis
Les,
To see the left and right borders in FF add this to #maincontent

display: table;

Using web developer on FF reveals a slight horizontal offset between the 
borders and the top and bottom images, so you may have to play with the 
padding/margins to get rid of the offset. This will probably screw up IE, 
but better to get it to work properly in FF then fix the IE float bug.

hth,
Jim

On 9/3/05, Les Mizzell [EMAIL PROTECTED] wrote:
 
 I've got this working almost exactly like I want in IE, but
 Netscape/Firefox doesn't want to give me the lft/rgt borders like IE is
 doing.
 
 I've been goofing with this just a little too long now, and maybe
 another set of eyes would help..
 
 File in question:
 http://65.36.231.94/contact.cfm
 
 CSS:
 http://65.36.231.94/scc.css
 
 The toppers with curved corners are gif files. The lft/rht borders are
 CSS.
 
 Ideas?
 

__
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] Positioning Confusion

2005-09-01 Thread Jim Davis
Using position: absolute for the menu is placing the menu in relation to the 
top left corner of the viewport. I would change the menu div to:

position: relative;--could be deleted
width: 760px;
margin-left: auto;
margin-right: auto;
margin-top: -20px;
padding-left: 5px;
height: 25px;
background: url(http://www.insidedesign.info/bck/images/contentBacground.gif) 
repeat-y;
}

Jim

On 9/1/05, Klear [EMAIL PROTECTED] wrote:
 
 I could not find answers to my specific problem in
 past postings, so here is my situation:
 
 HTML: http://www.insidedesign.info/bck/index.html
 CSS:
 http://www.insidedesign.info/bck/css/internet-web-design.css
 
 I am trying to develop a simple centered layout with a
 flow like this:
 Header
 Menu
 Content
 Footer
 
 The layout should all fall within a width of 760
 pixels. My problem comes down to positioning
 everything. I am not sure why my menu is not falling
 directly underneath the header. I thought I understood
 the box model, but I guess not =/
 
 

__
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] Converting javascript heavy page to CSS2 - help needed

2005-08-31 Thread Jim Davis
Pat,

Here is a link to an interesting approach for image replacement
http://alistapart.com/articles/imagemap/
Jim

On 8/31/05, Pat Pruyne [EMAIL PROTECTED] wrote:
 
 Greetings,
 
 I'm still medium-low on the CSS learning curve and have been
 tasked to update a site created by someone else that has lots of
 javascript button image replacement actions at the top of it.
 
 My temptation is to just take the javascript and tuck them into
 their own containers so that I can position them.
 
 I am certain there is a better way to do this.
 
 Here's the page:
 
 http://www.valleyvethospital.com/index2.html
 
 I would welcome pointers and clues as to how I should approach
 this and learn something (a lot!) in the process.
 

__
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] Collapsed margin in Firefox

2005-08-22 Thread Jim Davis
Sarah,

I don't see anything in the css to give seperation between #crumb and 
#middle. I would add margin-bottom:1em; to #crumb. This looks OK in FF, not 
sure about IE.

Jim

On 8/22/05, Smith, Sarah [EMAIL PROTECTED] wrote:
 
 Hi all,
 There's a section of a site where the margin appears to be collapsing in
 Firefox (and all non-IE browsers). I can't figure out what's triggering
 it, but it must be in the stylesheet added for that section. Both the
 sidebar menu and the content should be about 1em from the orange crumb
 trail -- like it is on the rest of the site. ... 


Misbehaving page: http://www.fresnolibrary.org/teen/hc/index.html
 CSS that probably created the problem:
 http://www.fresnolibrary.org/teen/hc/hwctr.css
 The way it's supposed to be:
 http://www.fresnolibrary.org/teen/prtn/index.html
 
 TIA,
 Sarah
 
 
 __
 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://evolt.org -- 
 http://www.evolt.org/help_support_evolt/

__
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] 3-Col Float problems in IE6

2005-08-19 Thread Jim Davis
Ron,

Sounds like the IE double margin bug. See 
http://www.positioniseverything.net/explorer/doubled-margin.html

Jim

On 8/19/05, Pringle, Ron [EMAIL PROTECTED] wrote:
 
 Can't quite conquer this one.
 
 I'm using the faux columns method for a three column layout. I'm having
 problems with one particular page which has left-floated images in the
 center body content, which is causing the third, right-floated column on 
 the
 right (the list of sponsors) to slip down underneath the center body 
 content
 in IE6.
 
 http://tinyurl.com/8f2a7
 
 

__
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] faux column not working

2005-08-13 Thread Jim Davis
Hi,

Here are some resources with different solutions to the problem:

http://www.pmob.co.uk/temp/2col_main.htm
http://wellstyled.com/css-2col-fluid-layout.html
http://www.projectseven.com/tutorials/css/pvii_columns/index.htm

Of the three, I find the latter, Al Sparber's JavaScript solution,
easy to use and very adaptable to a wide range of column layouts.

Check the list wiki, http://css-discuss.incutio.com/ , for additional resources.

Jim

On 8/13/05, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote:
 [I want] to make the navigation column span the length of the container...
 
 http://www.alforddesigngroup.com/sandbox/index.html
 
 http://www.alforddesigngroup.com/sandbox/css/styles.css
 
 dwain
__
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] Closing a Clear

2005-08-10 Thread Jim Davis
Hi,

Ad this rule to .pageBox...  display: table;
This should cause the red border to extend below the two columns of text.

Jim

On 8/10/05, Hershel Robinson [EMAIL PROTECTED] wrote:
 http://www.mishpachaw.com/eng-featuresLarge.php?w=fiction
 
 I have tried a few different methods to fix this page in FF, but nothing
 seems to work--the lists of the magazine features extends below the red
 box--I want them of course to be within the box.
 
 The CSS is here:
 
 http://mishpachaw.com/css/main.css
 
 Any suggestions are appreciated.
 
 Hershel
__
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] None

2005-08-09 Thread Jim Davis
Hi,

Try removing the position: fixed rule.

The spec says this about position fixed:
The box's position is calculated according to the 'absolute' model,
but in addition, the box is fixed with respect to some reference. In
the case of continuous media, the box is fixed with respect to the
viewport (and doesn't move when scrolled)

It seems that FF is playing by the rules.

Jim 

On 8/8/05, Zog [EMAIL PROTECTED] wrote:
 I have been trying to come up with a template for image display
 (centering and background).
 I had decided to use this http://chronophobia.org/alcohol.htm because it
 does not require you
 to specify the size of the image, but in Firefox if the image is larger
 than the viewing window
 you get no scroll bars. I don't really need to use it for such large
 images but it troubles me.
__
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/


  1   2   >