Re: [css-d] jumpy page/won't scroll down in IE

[Walt F. Schaefer]

HI David,

I got the jumping/no-scroll problem fixed by elminating a javascript call.
It was only an issue in IE 6 and IE 7.

thanks for the screenshot -- it looks like you've enlarged the font size (I
hope it's not defaulting to that!)  I know that on the largest font increase
the text will sometimes hide behind the nav bar (as it appears to be doing
here).  Not sure how to get around that!

Peg
__

I would change this:

#menu dt {
width: 11em;

To this:

#menu dt {
width: 140px;

That should force your top-level menu items to expand vertically by breaking
the lines rather than expanding the box horizontally.

Walt


__
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] newbie questions

[Walt F. Schaefer]

 
1. On this page
http://adswebsite.net/yahoo-search-versus-google-adwords.html, on the right
column where it says More AdsWebsite Guides and below that, the colored
cells/rows are taller than I want. How can I keep them about the same height
as the text for each cell? On this page: html
http://adswebsite.net/affiliate-networks-for-webmasters.html I added a css
attribute for line-height = 1 ems, but that didn't help for the
http://adswebsite.net/yahoo-search-versus-google-adwords.html page. ???

2. The digg link is javascript, and when you click on it, it opens to the
same page. I would like it to open to a new page. How do I do that with this
particular link where the script is provided by digg? (oops, that's not a
css question)

Thanks for your time to answer these questions! Looking at the archives...I
have a LOT to learn.

Ross


On your first page this is causing the problem:

td rowspan=8

Row  Column spans are generally a bad idea. And, you need to study HTML and
learn how tables behave.

Best table-based solution for your page is a 2-column, 1-row table. Then
nest a 1-column, 8-row table inside the right cell of the first (outer)
table. Row height in that nested table will be determined by content,
padding, etc. and will be independent of the content in the left cell of the
outer table.

Walt

__ NOD32 2486 (20070827) Information __

This message was checked by NOD32 antivirus system.
http://www.eset.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] CSS to eliminate dotted borders on hyperlink clicks

[Walt F. Schaefer]

 
I remember reading somewhere about CSS you can add, so that links won't get
the dotted border around them when you click on the links , but I cannot
remember what it is. Can anyone refresh my memory? This may be just a
Firefox thing.

--
::Bruce::


That dotted outline is there for accessibility. If the visitor navigates the
page using the keyboard the dotted outline tells them the link (image) is
active (selected). Removing the outline, IMO, is a bad idea. Form really
should follow function, again IMO.

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


__ NOD32 2486 (20070827) Information __

This message was checked by NOD32 antivirus system.
http://www.eset.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] Best practices or what?

[Walt F. Schaefer]

 
If the IDE generates that kind of selector-chains _all_ the time - that 
IDE is just producing unnecessary, nonsensical, garbage. All you'll end 
up with is huge file-sizes on those stylesheets, and a clean-up and 
maintenance-nightmare.
I guess I needed to form my question better, but the above is what I
thought.
I knew about using it to mark off a specific area of a site,..

I got the new Dreamweaver for a certain job I have coming up where I will
need to align a TON of divs over an image. (I normally use the gVIM editor
for Mac)

I was curious about how it generated CSS, and that's just one thing I found.
I was trying to figure out why they did that, perhaps I missed something (on
the list of things I've missed) along the way.

Please do not continue this tread with comments about DW CS3, I was just
curious about the code.

- Cheers -

need to align a TON of divs over an image

That is likely to be a disaster. Suggest you rethink this before you build
an unusable and unmanageable page.

Walt



__
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] 2 problems: text shoving and IE6 oddity

[Walt F. Schaefer]

 
 Good evening list,

 Fiddling with a mockup and i ran into 2 problems:

[1] the text on the right hand side of the top (mad cow..) shoves to the
left when resizing the viewport. Is there a way to let it stay put?

[2] in IE6 the whole page is shoved to the right and the #masthead image is
not showing up.

 http://www.dzinelabs.com/sandbox/madcow/madcow.html

 
As to #1: You declared a min-width of 780px for the body tag. You declared
no width for the masthead div so it collapses as the width of the viewport
is reduced, but only until the viewport reached 780px width. The h1 is set
to position:absolute right:20px so it follows the right edge as the viewport
is reduced in width.

One possible fix: declare a width for #masthead.

I'll leave #2 for someone else.

Walt


__
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] HELP!!!!

[Walt F. Schaefer]

 

-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of David Terrell
Sent: Tuesday, October 02, 2007 9:12 AM
To: css-d@lists.css-discuss.org
Subject: [css-d] HELP

Hello,

I'm new to css.  This is the first site that I've coded in css.  My problem
is that there seems to be a padding that is shoving all of the content down
on the page when it loads in any browser.  I don't understand because it
shows up fine in Dreamweaver.  I'm also trying to create a pure css pop-up
menu as per
http://moronicbajebus.com/wordpress/wp-content/cssplay/pop-up-menus/
and it just isn't working out.  The site is located at
www.cometothewell.org/newsite.  The css is located at
http://www.cometothewell.org/newsite/styles.css.  I appreciate any help
available.

Thank You,
David Terrell



This is what is moving your content down in FF2:
#main-text {
margin-top: 280px;

 


Don't let your dream ride pass you by. Make it a reality with Yahoo! Autos.
http://autos.yahoo.com/index.html
 


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

__ NOD32 2486 (20070827) Information __

This message was checked by NOD32 antivirus system.
http://www.eset.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] What type of positioning to use

[Walt F. Schaefer]

Subject: [css-d] What type of positioning to use

I'm at bit of a loss when it comes to building a website. I've mocked up a
layout in an old program called Layout Master and the layout seems to work
fine in most browsers. However, the layout uses absolute positioning and
z-indexes to achieve the layout. Is this wrong and if so why?

Also, are there current, basically agreed upon standards for building
websites, i.e. how to spec fonts (%,em or pts?), or what positioning system
to use? Or is it more of a wild west, whatever works for that particular
project idea?
__

Start here: http://www.great-web-sights.com/g_layerlaws.asp

Layers (absolutely positioned elements) are rarely a good approach to
general page construction. You can use them sparingly for special purposes
but you should only do so if you fully understand their limitations and
pitfalls. A page relying heavily on layers will be fragile and subject to
vagaries in rendering browser-to-browser. And, if the visitor increases
their font size the page will likely break badly.

As to the wild west, that was in the mid to late '90s. Today's web is the
peoples' web. The user is king and a properly constructed page/site will
focus on usability. Layers rarely allow that.

Font sizing? Seems like ems or % are preferred. I use %. Regardless, never
use pts, they are for the print world and don't translate adequately to a
computer screen.

Or at least that's my opinion  approach.

HTH

Walt

__
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] image problem..

[Walt F. Schaefer]

Hi

Put an image in my siteand its appearing as if it has around the edges,
if anyone can  quickly  look at it, would appreciate it.

Mike:)

http://ijsr32.infj.ulst.ac.uk/~10300205

Portfolio page

current work
watery marks
Please view in Mozilla


I have no idea what you mean by watery marks, but the native size of the
image is 557 X 371 pixels. You have squeezed it down to 200 X 200 pixels, a
very bad practice. Re-size the image in an image-editing app (I use
PhotoPaint). And, you can't alter the aspect ratio as you have without
distorting the image.

If you are determined to be a web designer I think a thorough understanding
of bitmap images is essential.

Walt

__
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] Alternative Menu suggestions to the Suckerfish

[Walt F. Schaefer]

On 21/09/2007, David Laakso [EMAIL PROTECTED] wrote:
  Could you please check the following menu in IE6 and 7? I am told 
  the menu is not behaving correctly.
  http://theriverchurch.info/
  http://theriverchurch.info/wp-content/themes/RiverChurch/style.css

 The Lord works in mysterious ways: perhaps you are being reprimanded 
 for knowingly using a menu that drives everyone nuts who attempts to 
 use it; not optimizing the images; and, making the start point of the 
 primary content so tiny.

 The drop-down /drops down/ in 6 and 7.

 In 7 they stick, that is to say, when hovering across all of them 
 they are simultaneously stuck in the drop-down position.

 In 6 the drop down boxes do not stick but they are wider than in 
 compliant browsers (and even ie7), and each has a double vertical rule 
 on both sides. There is a gap under the header image. And the header 
 image, and the black block beneath that image, and the black footer 
 block are all about 70px shy of the outermost container's right border.

Many thanks for the reply. I have changed the subject to reflect the next
question. What do folks do if they don't use the suckerfish option please?
Any suggestions?
--
Kind regards
Rich





I use P7 menus, specifically PMM  TMM
http://www.sitepoint.com/forums/showthread.php?t=345568page=5highlight=bro
wsercam

Walt 

__
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

[Walt F. Schaefer]

-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of Cory Shubert
Sent: Friday, September 14, 2007 5:44 AM
To: css-d@lists.css-discuss.org
Subject: [css-d] Site check please

Hi all,  I am throwing our new design out there for critique and
suggestions.
 
http://www.nwaworldvacations.com
BLOCKED::http://www.nwaworldvacations.com 
 
We tried to do a better job of CSS and moved into a more Web 2.0 vibe, at
least that is what we were trying for.  I am sure many will lament our use
of tables still, but some habits die hard.  I am curious to learn how we
might have done a better job with our CSS, i.e. better use of IDs or
Classes, less nested, more nested...
 
We did add some Ajax/JavaScript functionality that we didn't have in our
previous designs, and are noticing slow page loads and would love to learn
or hear of how others handle this better.  The Las Vegas destination page is
a particularly slow one due to the backend loading of all the hotels... then
do a price find and it can take up to 22 seconds to return all the prices
for each of them.  This is something we are working on to fix/solve/adjust.
 
Our team is small and we based much of our work on the few classes or
seminars we have been able to attend as well as on Andy Budd's CSS
Mastery.
 
###

Start here:
http://www.websiteoptimization.com/services/analyze/wso.php?url=http://www.n
waworldvacations.com/

A good target size for a page is about 70k.

Walt 


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