...

View Full Version : A simple one, learning CSS



abduraooft
06-04-2007, 04:51 PM
Hi all,

Here is the link http://casemumbai.com

An orthodox layout, only 5 tabs, but all in a single page (used the ‘display’ property) +an external javascript and CSS too.

I've removed most of the tables which were used previously (thus I reduced its filesize from 36 to 16kb), but I'm sorry to say that I couldn't completely get rid of them in this layout.

I hope its negligible :D .

mlseim
06-04-2007, 05:15 PM
Not a bad layout, but for some reason, took a long time to load.
That must be because of the preloaders?

And, I didn't turn off Javascripting, but with JS turned off, can
you still navigate the site? This might cause some accessibility issues.

twodayslate
06-04-2007, 11:45 PM
Looks great and very professional but I do not like the font. Change the font to verdana and make the nav/footer font bigger.

Not 800x600 friendly.

ahallicks
06-05-2007, 09:11 AM
Take a look at the thread (http://codingforums.com/showthread.php?t=115269) regarding the javascript menu and take note of Aerospace's posts in particular!

I agree with the font issue, it's very readable, but it doesn't seem to tie in well with the site.

abduraooft
06-05-2007, 03:41 PM
Take a look at the thread (http://codingforums.com/showthread.php?t=115269) regarding the javascript menu and take note of Aerospace's posts in particular!

I agree with the font issue, it's very readable, but it doesn't seem to tie in well with the site.

Thanks a lot for all for the suggestions.

I changed the font to Verdana and footer font bigger.

I agree to the fact that using different pages for different contents and CSS menu instead of javascript would ease a browser with no javascript.

In this case I considered a fast navigation between different contents (know the cost of loading all items in a single load) because the only difference here is in some 10-15 lines of text.

But I still don't understand why people (_Aerospace_ also mentioned in a thread that he too) completely turn off the support for javascript in their browsers even in these era where technologies like Ajax are very popular.

regards,
art

_Aerospace_Eng_
06-05-2007, 06:50 PM
Thanks a lot for all for the suggestions.

I changed the font to Verdana and footer font bigger.

I agree to the fact that using different pages for different contents and CSS menu instead of javascript would ease a browser with no javascript.

In this case I considered a fast navigation between different contents (know the cost of loading all items in a single load) because the only difference here is in some 10-15 lines of text.

But I still don't understand why people (_Aerospace_ also mentioned in a thread that he too) completely turn off the support for javascript in their browsers even in these era where technologies like Ajax are very popular.

regards,
art
Yes it may be but I turn it off to prevent other things like pop-under ads, or ads that use javascript. If I trust the site I'll enable javascript, if I don't trust then then I won't. In some places javascript is disabled simply because people use it maliciously.

abduraooft
06-06-2007, 11:08 AM
Ok, thanks _Aerospace_Eng_...

And before windup this thread let me seek one more help.

When I changed the DOCTYPE from
"-//W3C//DTD HTML 4.01 Transitional//EN" to
"-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd" , got some more validation errors and fixed them all (including target="_blank" with javascript)

and here is my modified page http://casemumbai.com/case/index1.php

Unfortunately an unwanted horizontal full stretched gap is detected only in Mozilla and not in IE-6 or Opera-9 between the header area and the content area.

However if I revert the DOCTYPE , the gap disappears.

Any clues?

Regards,
art.

_Aerospace_Eng_
06-06-2007, 02:08 PM
Add this to your CSS

td img {
display:block;
}
Read this for more info: http://developer.mozilla.org/en/docs/Images,_Tables,_and_Mysterious_Gaps

abduraooft
06-06-2007, 04:00 PM
Add this to your CSS

td img {
display:block;
}
Read this for more info: http://developer.mozilla.org/en/docs/Images,_Tables,_and_Mysterious_Gaps

Hi _Aerospace_Eng_,

You are wonderful!

This was really unexpected and I'm too silly to search this problem on web :o (google gives the above link for keywords doctype+mozilla+unwanted+gap)

Thank you so much.

abduraooft
06-13-2007, 07:05 AM
Not 800x600 friendly.

It seems to be really a problem for me. I used an image having 775px width as the main header and there are two colomns to the left of main text having 223px and 100px width. Only the rest of areas support a variation in width and height!

If I change the width of email sending form under the 'contact us' menu compatible with an 800x600 resolution, then it looks very slim when veiwed in a 1024x800 monitor.


My questions is- Is there any generally accepated methods/conventions that resolve the appearance problems due to resolution of monitor?

Thanks n regards,
art

_Aerospace_Eng_
06-13-2007, 07:40 AM
Don't use fixed widths for everything. Your layout resembles the one found here the most
http://bonrouge.com/2c-hf-fluid.php
Follow that tutorial.

abduraooft
06-13-2007, 09:41 AM
Don't use fixed widths for everything. Your layout resembles the one found here the most
http://bonrouge.com/2c-hf-fluid.php
Follow that tutorial.

Thanks _Aerospace_Eng_ for this link.

Since my website has 4 such columns and all of them except the large middle one (holding main text) have different background images.
I've downloaded the 3c-hf-fluid.php and trying to split the left column in to two. :thumbsup:

regards,
art.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum