CSS - Help Changing Page From Table Driven To Css

How is it that safari is toooooo stupid to recognize the fact that I've specified background images... it also doesn't recognize the display:inline attribute. Are these just things that are unsupported in safari? I can't for the life of me figure out why it's doing this.

Code:

#tabs ul {
	padding-left: 0;
	margin:0px;
	display: inline;.
	} 
#tabs ul li{
  	width:170px;
  	height:25px;
	list-style: none;
	display: inline;
  	text-decoration:none;
  	z-index:1;
	} 	
#tabs ul li a{
  	height:25px;
	background-image: url("../images/mainTab.jpg");
  	background-repeat: repeat-x;
  	display: inline;
  	font-size: 10pt;
	color:#fff;
  	text-decoration:none;
	}
#tabs ul li a.selected{
	background-image: url("../images/mainTabSelected.jpg");
  	background-repeat: repeat-x;
  	color:#000;
	}

Hello there
I would like to ask you a question concerning pop up menus. It turns out that I have seen some techniques which use just CSS. Nevertheless, what I usually see is techniques that use javascript to achieve this pop up menus. It seems to me that javascript might be a more simple and straightforward technique for this purpose although I do not know because I have not implemented neither of them yet.
Since I want to build a pop up menu, I would like to hear your suggestions in terms of advantages and disadvantages of css driven pop up menus against javascript menus. As far as I know, javascript is a disadvantage because it might not work sometimes when it is disabled in the browser. But, tell me your point of view, because I am sure you have lot to say about this.

Another thing that I would like to do is defining myself the shape and colors of this pop up menus so please, you can bear in mind this point for any suggestion concerning the previous paragraph.

In conclusion, bearing in ming that lot of you will have had some experience working with pop up menus, I would appreciate any sound suggestion about the best or the most standard approach to let me start working on a custom pop up menu.

If you there might be other more interesting and useful way of doing these pop up menus that is not css or javascript, please tell me as well.
I look forward your replies.
Thanks in advance.

hey, i have a question regarding css on my website:

http://poolghost.com/

my css file is located at http://poolghost.com/base.css

basically what i am trying to accomplish is having a:hover's color change to a different color on the right side of the layout. and i would like links on the right side to be underlined.

please advise.. thanks, --avery

Hello: I am building a website for a broad audience. I need there to be an option for text to be resized for those who have trouble with reading screens. I am trying to have the text on HTML pages be changeable through CSS.

Two examples I offer are (URL address blocked: See forum rules) and (URL address blocked: See forum rules)

On the top right corner of the screen, there are options to change the text size without switching to a new HTML page. I believe this is done using CSS (perhaps Live StyleSheet Selector). I'm not really sure.

If anyone can help me, I would really appreciate it. Thanks!

Deanna

Hello,

I have a page that has one big table covering all areas. The problem is that there is a tiny white gap between edges of the table and the edge of the page. How do I eliminate this?

Thanks,
Jeff

Hi,

Im having a problem centering a DIV table exactly how i want it too.

I want to be use the DIV table so that it will be only a few pixel away from the top.. so lets say 80px from the top and being centered horizontaly, so that it will display the samething for both 1024x768 & 800x600.

ps: the DIV table needs to be aligned to the right so that the image will appear on the right in both 1024x768 & 800x600

I have included/attached a image to kinda give a better idea.

how do i center align table on page with CSS?

I've been tweaking a bit of the site I edit for Oxford Hash House Harriers (search Google for Oxford Hash House Harriers and our site will appear at the top) and trying to get a blue bar for the left and right side bars all down the page, which I've now succeeded in doing, however in my changes something has changed because now there is a large gap between any content and a table but only in some browsers. The tables are used for actual data, not for layout. I use CSS and <div> for layout.

The layout is along these lines:

Code:
<body>
<div id="page">

<div id="banner">
<div id="leftlogo"> <!-- logo here --> </div>
<div id="rightlogo"> <!-- logo here --> </div>
<div id="oh3banner"><p class="pagetitle">Oxford H3</p></div>
</div><!-- close div banner -->

<div id="mainbody">

<div id="wrap1">
<div id="wrap2">

<div id="leftnavigation">
</div><!-- close div leftnavigation -->

<div id="rightnavigation">
</div><!-- close div rightnavigation -->

<div id="content">
<h1>Oxford Hash House Harriers</h1>
<h2>Oxford H3 Hash Diary </h2>
<div id="hashdiary">
<table summary="Oxford H3 Run Diary">
<caption>Forthcoming Oxford H3 Hashes</caption>
<colgroup>
<col id="date" />
<col id="postcode" />
<col id="venue" />
<col id="hare" />
<col id="beermaster" />
<col id="chef" />
<col id="run" />
</colgroup>
<thead>
<tr>
<th scope="col">Date</th>
<th scope="col">Post Code & Grid Ref.</th>
<th scope="col">Venue</th>
<th scope="col">Hares</th>
<th scope="col">Beer Master</th>
<th scope="col">Chef</th>
<th scope="col">Run#</th>
</tr>
</thead>
<tbody>

<tr>
<td>data</td>
<td>data</td>
<td>data</td>
<td>data</td>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
</tbody>
</table>
</div>
</div><!-- close div content -->

</div> <!-- close div wrap1 -->
</div> <!-- close div wrap2 -->

</div> <!-- close div mainbody -->
</div><!-- close div page -->
</body>

Whilst the relevant (I think) parts of the CSS look like this:
DIV#page{
margin-top: 0px;
}

DIV#banner{
width:100%;
background-color : #06168a;
height : 130px;
margin-left : 0px;
margin-top: 0px;
position : absolute;
top: 0px;
float : none;
}

DIV#oh3banner{
clear : none;
background-image : url('images/oxfordh3banner.jpg');
background-repeat : no-repeat;
height : 110px;
margin-top: 10px;
background-position : center;
}

DIV#mainbody{
margin-top: 130px;
}

DIV#wrap1{
background-color : #06168a;
}

DIV#wrap2{
background-color : #06168a;
}

DIV#leftnavigation{
width:15%;
background-color : #06168a;
margin-left : 0%;
float: left;
}

DIV#rightnavigation{
width:15%;
background-color : #06168a;
margin-right : 0%;
margin-left : 3%;
float: right;
}

DIV#content{
width:auto;
margin-left : 15%;
margin-right: 15%;
padding-left: 5px;
padding-right: 5px;
background-color: White;
}

I found to begin with that there was a very large gap between the table and any content on the page in all browsers until I put a <div> </div> around the actual table itself. When I did this the page looks okay in Firefox and Safari, but still looks incorrect in Internet Explorer and Chrome. It looks to me as if the table is being pushed below the content in the right sidebar in IE or the left sidebar in Chrome for some reason.

I've been messing about for a while now trying to get this to work but without success. Can anybody spot where I'm going wrong?
Regards,
James

Hi there,

I have an HTML/CSS design I'm working on, that can be accessed he

http://www.design-portal.co.uk/demo/

The CSS can be found he

http://www.design-portal.co.uk/demo/style.css

Basically what I would like is this:

I want another static area that always appears at the bottom of the page underneath the main content text. As I've fixed the big box thing's height (it's going to appear the same height on every page) I want the user to be able to scroll to the next page if the text is too long to fit on the one page. I've created a screenshot as an example:

http://www.design-portal.co.uk/demo/images/demo.jpg

As you can see, the text at the bottom allows the user to scroll forwards and backwards. I can do this, but it never appears at the bottom; always just underneath the text above it depending on how much text is in the place. How can I just get the damn thing to stay at the bottom regardless of how much content is above it?

Cheers in advance,

Dave

hi

i have a page that contains a large html table. this table spans many pages (in internet explorer it spans 6 pages). however, when i view the print preview in firefox it only shows 1 of 1 page, and at the bottom of the page, where i would expect a page break to exist, the table continues on and then off the bottom of the page. basically, it seems to be attempting to render the entire table on to one page, even though it won't fit.

has anyone got any ideas how i can make this table print on multiple pages?

i've read somewhere that gecko based browsers have a problem with floated content, but i'm sure i've un-floated everything.

thanks in advance.

dave

Hi, how can I set the <a> tag (of <a href...) to be of some color in one div and some other color in another div?

I need some help. I'm starting out with php and i'm already stressing out.
Here's the challenge:
I have to make a page that contains 3 radio buttons
the radio buttons control which color font you'll like to display on that page
the page must reference itself (no outside css stylesheet)
I must use the switch function to switch the stylesheet.

So far, this is what I have.

Can someone help me figure out what I'm doing wrong?

Thank you.

Dan

--------------clipping starts here---------------------

<html>
<head>
<title></title>
<body style="font-family:Arial, Helvetica, sans-serif; color: green;">
</table>
<tr>
<td>
<form name="stylecolor" method=POST" action asgn_2j.php">

Green
<input type="radio" name="style" value="a">

Blue
<input type="radio" name="style" value="b">

Red
<input type="radio" name="style" value="c">

<INPUT TYPE=HIDDEN NAME=stylecolor VALUE=true>

<INPUT TYPE=submit NAME="SUBMIT" VALUE="Submit">


$stylecolor=$HTTP_POST_VARS['stylecolor'];

switch($stylecolor)
{
case 'a'
echo '(<body style="font-family:Arial, Helvetica, sans-serif; color: green;">)' ;

case 'b'
echo '(<body style="font-family:Arial, Helvetica, sans-serif; color: blue;">)' ;

case 'c'
echo '(<body style="font-family:Arial, Helvetica, sans-serif; color: red;">)' ;

default:
echo 'you didn't choose' ;
break;

}
</form>
</td>
</tr>
</table>
</body>
</html>

Hello,

I have been looking all ovet the forums and google and cant find a code to do this.

what i am trying to do is when someone prints a page, i want the footer that is automataly printed at the bottom of the page to change.

Lets say your on www.yahoo.com and you print the page.
the footer will say http://www.yahoo.com

what i am trying to find is a code that i can change the footer to say whatever i wanted.

so if your on yahoo.com and press print it says "HELLO" (for example).

Thanks In Advance.

hey all,
so im way behind the times when it comes to creating webpages with div's instead of nested and renested tables. I can nest tables with the best of them but when it comes to using div's and css instead i just can't figure out how to precisely place things! Does anyone know of a guide that explains how to use divs effectively instead of tables?
thanks
- legit

I have a header.inc and a css style sheet that are called to each page of a website via php. In the style sheet there are two styles that I would like to change depending on the section of the website.

For example:
in the style sheet
css id "subnav" has background: #E8EDF5 and
cssi id "subtitle" has background #E8EDF5

however in each major section of the website I would like to change the background colors of the divs that have id "subnav" and "subtitle".

Is there type of php statement that I could place at the top of my website pages that would allow me to specify the colors of these two css ids?

Hope I have made this clear.