CSS - Css Stylesheet

On the one hand Accessibility guidelines state that sites should work even if stylesheets fail to load...

... and then on another hand, you're told not to include any style/layout/formatting within an html page - to use the stylesheet instead.

My question is this. Say i create a site which is arranged in the common layout of header at top, nav menu floated to the left, main content sitting on the right, and then footer below.

Should the layout of the div's, namely the float left etc be within the webpage or the stylesheet.

I guess most people will say stylesheet, but that means if the stylesheet fails to load, the site layout will be completely messed up with the content appearing below the nav menu.

Do you make an exception in this case and include some limited layout-style information in the webpage? What are people's opinions on this?

Hello All,

I was hoping that you could look at a site for me, and help me figure out what is causing the rendering issues in IE6/7. I have a separate CSS stylesheet for anything that is IE7 or lower; however, I am not sure if it is actually loading at all.

I don't really have access to IE6/7 in a live environment, to check everything about the site, so if anyone has any suggestions for tools that will allow me to work with a live view of IE6/7 that would be a great help as well.

The site link is: http://www.saracanada.com/

Thanks in advance everyone.

Hi

Could someone assist me in making a print stylesheet for this site please!

http://calibrehr.com/new/

What I need is:

just the logo to display (remove nav)
The text in the orange block to span the width of the page
Remove subnav
Some how diplsay the text that is in the purple boxes below the main content text

I am stuck as to what to do and could really appreciate some help

Many thanks!

Can you only exclude elements from a Print stylesheet?

I'd like to print only a table of data and nothing else on the web page in a print style sheet.

Hi people,

I am completely new to programming and have only spent this weekend learning it!

I have managed to create a decent website already, however i am stuck at a point. On my main page, i have attached a CSS stylesheet with all the formatting for my page. My problem however is that when i try to format one section (<div id="gallery">) the formatting messes with the rest of the page.

Is there a way that i can assign a style sheet to only that <div id="gallery"> without it applying to the entire html page.

Any help is greatly appreciated!

Thanks

Chris

ok the stylesheet contains this:
BODY, TD, TR, P, UL, OL, LI, INPUT, SELECT, DL, DD, DT, FONT
{
font-family: Verdana, Arial, Clean, Helvetica, sans-serif;
font-size: 12px;
}

and I need to add this into it

BODY {
scrollbar-face-color: #DEE3E7;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #DEE3E7;
scrollbar-3dlight-color: #D1D7DC;
scrollbar-arrow-color: #006699;
scrollbar-track-color: #EFEFEF;
scrollbar-darkshadow-color: #98AAB1;
}

Ok here's what I don't understand. The original stylesheet(used by a php script) contains lots of things at the top separated by commas. Does that mean that it will affect all of those things?
So I have to do this?

BODY
{
font-family: Verdana, Arial, Clean, Helvetica, sans-serif;
font-size: 12px;
scrollbar-face-color: #DEE3E7;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #DEE3E7;
scrollbar-3dlight-color: #D1D7DC;
scrollbar-arrow-color: #006699;
scrollbar-track-color: #EFEFEF;
scrollbar-darkshadow-color: #98AAB1;
}

TD, TR, P, UL, OL, LI, INPUT, SELECT, DL, DD, DT, FONT
{
font-family: Verdana, Arial, Clean, Helvetica, sans-serif;
font-size: 12px;
}

Sorry about the newbie question, but I gotta start some where.

Hiya, theres a website I'm creating a print stylesheet for which includes the company logo in the header, with a footer of contact details. problem is, the website is all static pages and 100 odd pages, so as I'm having to deal with the static state of the site for now, is there a way I can have in the Print stylesheet or in the CSS where the logo can be inserted in a header and a footer created with text? hope this makes sense?

Hey,

I've run into a problem where I though i knew how to do it an easy way but it only worked for about 5 minutes.

Here is what I have. All of my pages have the same navigation from an external PHP file. The style is saved in the main.css stylesheet. When you select a link it gets a background image.

I thought that I could save my self having to edit every page for IE by doing this in the main.css stylesheet
Code:

* html>#navwhatever{
/*set to gif iamge instead of PNG image*/
background-image:url('image/splash_legion.gif');
}

This doesn't work. It still uses the PNG images. I'd realy like not to have to edit every page to fix my site for IE, any suggestions would be great.

Thanks for reading

Hi,

I am mainly concerned if this page's button navigation looks okay in Internet Explorer. It looks okay in Firefox, but when I view it in IE the blue background keeps popping through.

I have been told that it looks fine in IE, but it does not in MY version of it. So would you please use Internet Explorer to look at....

http://thetransactiongroup.net/advisor/NEW/thursday5.asp

Again, it's the left navigation buttons I am only concerned about. If it looks okay to one or two of you then maybe it's some bug in my own copy of IE.

If you see the button problem in IE then I will then ask for help to fix it.

THANKS

Rowby

I am using this css for my entire site, and it all shows up right under IE and Firefox. Konqueror is fine, just wont show the opacity filter. I tried to get it validated, and it doesn't like the opacity lines. First try at an external stylesheet, so could use the help.
I can't find anything on correct syntax to use other than what I have already used.


@charset "ISO-8859-1";

.fade {filter:alpha(opacity=70); -moz-opacity:0.7; background:#ffffff;}

font, td, p {color:#0000FF; font-size:medium; font-family:Comic Sans MS,sans-serif;}

a { font-size:medium; font-weight:bold; font-family:Comic Sans MS,sans-serif; text-decoration:none; color:#0000FF; }

.link1 a { color:#0000FF; }

hello guys! i have a form that contains a listbox, and am using IE6, and i put up a link to my external css file, but the appearance of listbox scroll bars didn't change, only the size of the font was changed, do i am missing something? or this is not possible to change the appearance of scrollbars for the listbox?

below is my HTML code:
PHP Code:
<html>

<head>
<title>Test Page</title>
<LINK href="styles.css" type=text/css rel=StyleSheet>
</head>

<body>

<form method="POST" action="test.htm">
    <p><select size="5" name="test">
    <option value="1">one</option>
    <option value="2">two</option>
    <option value="3">three</option>
    <option value="4">four</option>
    <option value="5">five</option>
    <option value="6">six</option>
    <option value="7">seven</option>
    <option value="8">eight</option>
    <option value="9">nine</option>
    <option value="10">ten</option>
    </select><input type="button" value="Submit" name="B1"></p>
</form>
</body>
</html> 




and below is my stylesheet:
PHP Code:
 BODY
{
    FONT: 8pt verdana, arial;
    COLOR: navy
}
TD
{
    FONT: 8pt verdana, arial;
    COLOR: darkslateblue
}
.helphead
{
    FONT: bold 16pt verdana, arial;
    COLOR: navy;
    TEXT-ALIGN: center
}
H2
{
    FONT-SIZE: 11px; FONT-FAMILY: verdana, arial
    COLOR: white
}
A:link
{
    COLOR: navy
}
A:visited
{
    COLOR: navy
}
A:hover
{
    COLOR: #ff9900
}
.funhead
{
    FONT: 10pt Arial,Helvetica;
    COLOR: navy
}
.deschead
{
    FONT: 600 10pt Arial,Helvetica;
    TEXT-ALIGN: center
}
.clsDescTab
{
    BORDER-RIGHT: lightsteelblue 1px solid;
    BORDER-TOP: lightsteelblue 1px solid;
    BORDER-LEFT: lightsteelblue 1px solid;
    BORDER-BOTTOM: lightsteelblue 1px solid;
    BACKGROUND-COLOR: aliceblue
}
INPUT
{
    BORDER-RIGHT: lightsteelblue 1px solid;
    BORDER-TOP: lightsteelblue 1px solid;
    BORDER-LEFT: lightsteelblue 1px solid;
    COLOR: navy;
    BORDER-BOTTOM: lightsteelblue 1px solid;
    FONT-SIZE: 11px; 
    FONT-FAMILY: verdana, arial
    TEXT-ALIGN: left
}
SELECT
{
    BORDER-RIGHT: lightsteelblue 1px solid;
    BORDER-TOP: lightsteelblue 1px solid;
    BORDER-LEFT: lightsteelblue 1px solid;
    COLOR: navy;
    BORDER-BOTTOM: lightsteelblue 1px solid;
    FONT-SIZE: 11px;  
    FONT-FAMILY: verdana, arial
}
.button {
    BORDER-RIGHT: lightsteelblue 1px solid; 
    BORDER-TOP: lightsteelblue 1px solid;
    FONT-SIZE: 8pt; 
    BORDER-LEFT: lightsteelblue 1px solid; 
    WIDTH: 70px; COLOR: #000000; 
    COLOR: navy;
    BORDER-BOTTOM: lightsteelblue 1px solid; 
    FONT-FAMILY: verdana, arial; 
}
TEXTAREA
{
    BORDER-RIGHT: lightsteelblue 1pt solid;
    BORDER-TOP: lightsteelblue 1pt solid;
    BORDER-LEFT: lightsteelblue 1pt solid;
    COLOR: navy;
    BORDER-BOTTOM: lightsteelblue 1pt solid;
    FONT-SIZE: 11px; 
    FONT-FAMILY: verdana, arial
} 

i have to move our site to drupal, and am having a huge issue with a certain div design.

Version 1 - Original, old site shows it working perfectly

but...

Version 2 - Drupal, new site shows all the divs incorrectly.

i have spent the past week, from 9-5 trying to figure this out but i think i have just burned out. .. can someone please help me here as this needs to be done since this is on the main page.

I know it has something to do with the side-feature and afeature divs ...

I am quite new to css and wandering how I can add my Stylesheet selection on the page to a dropdown list so the user can choose his/her theme.

I have the coding worked out for stylesheet selection and cookies saving and stuff just need help on how to display the 3 themes in a dropdwon list instead of 3 merged links on screen.

On my main page atm I have the code:

Code:

<?
include('includes/stylearray.php');
?>

<?
// WRITE OUT SWITCHER LINKS
while(list($key, $val) = each($styleSheets)){
 echo "<a href='styleswitcher.php?SETSTYLE=".$key."'title='".$val["title"]."'>".$val["text"]."</a>";
}
?>

but this just lists them as 3 links, I need them in a dropdown list but cant seem to format it right to do that.

Can anyone point me in right direction about splitting up that setstyle php bit into dropdown list instead of 3 ugly links?

Hi guys,

Having some problems with this site -- it validates ok but as you will
see the tables are displaying way off.

In Firefox -- the second td with the text is displaying underneath the
first td instead of alongside it

in IE -- the second td has a huge indent before the text, and the list isnt showing the bullet points

It's frustrating me hard as it was working the other night, and now I open it again something is wrong and i've no idea what I changed.

Any ideas?

ps hi i am new here!

edit: um ok it wont let me post the url since i am new.
its castworks dot com dot au forwardslash template_castworks dot html

if anyone can actually be bothered to look at that

Hey guys,
I'm new to these forums. I've got experience in CSS but have a few questions that may sound elementary but I can't figure it out and would appreciate any knowledge on this subject.

I can't seem to post URL's as a new user so I will have to explain.

The problem:
I see ID's and classes in a HTML file but they do not exist in the stylesheet. Is anyone familiar with this? Where is the ID getting it's style from?