Learn VBA & Macros in 1 Week!

CSS - Page Display Problem

Full Excel VBA Course - Beginner to Expert

Page Display Problem	View Content

well i have totally redesigned my orginal page due to problems with IE browser--

i am now using a two column template and have copied code exactly-- had both XHTML and CSS verified with the
W3C validator and they both check out to be ok--

the page is NOT showing up properly at all-- i am using FIREFOX as browser and i am wondering if i have now traded one problem for another

i would sure appreciate it if someone would just go and look at page to see if it shows up right in another browser-

THE PAGE

also here is the url for the

CSS CODE

here is link to how page is supposed to look--
CORRECT VIEW

if the page is not right in FOX does anyone know a work around to make it right??????

UGH UGH THIS IS SO FRUSTRATING
thanks in advance--

Full Excel VBA Course - Beginner to Expert

Similar Tutorials

Problem With Page Layout That Doesn't Display Correctly In Mac Browsers

Ie Cannot Display This Page

How To Display Two Different Links In A Page?

Firefox And Ie Display Same Page Differently

Sidebar Doesn't Display On One Page

If You Display: None An Image, Will It Load In The Page?

Page Doesn't Display The Same In Firefox As In Opera/ie6

How I Display Output In Same Page On Click In Link

Please Help! Urgent! Need To Display Logo And Menu On Each Page By Defaul

Css Display Problem

Display:none Problem

Ie7 Display Problem

Ie6 Div Display Problem

Ie6&7 Problem With Display

Ie Display Problem

Display Problem In Ie 6

Display Css Problem

Problem With Display:blocks;

Link Display Problem In Ie

Html Display Problem

Learn VBA & Macros for Excel in 1 Week!

Problem With Page Layout That Doesn't Display Correctly In Mac Browsers

Similar Tutorials

Hi

I wonder if anyone can help. I've been trying to tidy up the layout of my home page, and I'm pretty confused by the way that the header is behaving in both Firefox and Safari - the browsers I use on my Mac.

I've got screen shots which show it looking good on most Windows browsers, but for some reason, all the text is bunched up at the top when I look at it on the Mac.

This is a link to the page:

http://www.independentliving.co.uk/index1.shtml

And this is the relevant bit of the stylesheet:

div#header {
background-image: url("header.jpg");
background-repeat: no-repeat;
color: #FFFFFF;
margin-left:auto;
margin-right:auto;
margin-top: 0;
width:780px;
height: 200px;
margin-bottom: 10px;
font-size: 0.8em;

}

#header .welcome {
text-align: left;
width: 700px;
padding-top: 90px;
padding-left: 20px;
padding-right: 20px;
color: #003366;
font-size: 0.8em;
}

p.welcome {
text-align: left;
width: 700px;
padding-top: 90px;
padding-left: 20px;
padding-right: 20px;
color: #003366;
font-size: 0.8em;
}

#header .slogan {
text-align: left;
width: 700px;
padding-left: 20px;
padding-right: 20px;
color: #003366;
font-size: 0.8em;
}

p.slogan {
text-align: left;
width: 700px
padding-left: 20px;
padding-right: 20px;
color: #003366;
}

If anyone has any ideas, I'd be really grateful. I know Mac is a minority platform, but as it's the one I use, I'm pretty keen to get it working!

Thanks

Frances

Ie Cannot Display This Page

Similar Tutorials

Hi There -

Am stumped. Everyone I know is stumped.

We're using the cms Drupal on www.digitaldollhouse.com and whenever we update the site from svn, ie decides it doesn't want to display the page.

White screen of death. Notice: ie cannot display this page.

It occurs on all flavors of ie.

It used to be solved by clearing the caches. Not anymore.

The original authors of the html/css monster are contractors long since by the wayside. Another themer has taken over and she is very good, but had to work around some serious badness. She's also stumped. That leaves me.

I'd be grateful for any ideas on how to even start to troubleshoot this bug.

How To Display Two Different Links In A Page?

Similar Tutorials

I want to show in a page two different link styles, to achieve this I have created two css files, one for each link style, and I have attached it in the page thus:
Code:

<html>
<head>

<title>Link format test</title>

<link href="StylesCSS/link1.css" rel="stylesheet" type="text/css">
<link href=" StylesCSS/link2.css" rel="stylesheet" type="text/css">
</head>
<body>

Then I have applied the styles thus:
Code:

<a href="index.aspx" class="letterLink1">Home</a>
<a href="forgotten_password.aspx" class="letterLink2">I have forgotten my password</a>

And both css files are as follow:

link1.css
Code:

a:link {
	font-family: Arial;
	font-size: 12px;
	color: #669966;
	text-decoration: none;
	font-weight: bold;
}
a:hover {
	font-family: Arial;
	font-size: 12px;
             color: #568156;
	text-decoration: underline;
	font-weight: bold;
}
a:active {
	font-family: Arial;
	font-size: 12px;
	color: #568156;
	text-decoration: underline;
             font-weight: bold;
}
.letterLink1 {
	font-family: Arial;
	font-size: 12px;
             color: #669966;
	text-decoration: none;
             font-weight: bold;
}

link2.css
Code:

a:link {
	font-family: Arial;
	font-size: 10px;
	color: #669966;
	text-decoration: underline;
}
a:hover {
	font-family: Arial;
	font-size: 10px;
	color: #FFCC66;
	text-decoration: underline;
}
a:active {
	font-family: Arial;
	font-size: 10px;
	color: #FFCC66;
	text-decoration: underline;
}
.letterLink2 {
	font-family: Arial;
	font-size: 10px;
	color: #669966;
	text-decoration: underline;
}

But when I load the page, the link1 a:hover and a:active are showed as link2 a:hover and a:active. What is wrong?

Thank you,
Cesar

Firefox And Ie Display Same Page Differently

Similar Tutorials

I've been working some more on a new layout for one of my websites this weekend. However, I'm having trouble getting the layout to display the same in all browsers. Everything is looking exactly how I hoped in Firefox, but when the same page is viewed in Internet Explorer, some things appear rather differently.

Sample Page: http://www.mybb-emods.com/new/index.htm
CSS File: http://www.mybb-emods.com/new/stylesheet.css

Firstly, the background of the navigation bar at the top of the page should remain grey at all times apart from when a link is hovered, in which case it changes to blue. This is happening in both browsers, but in Internet explorer, only part of the background is changing as opposed to all of it. It's easier to show this than to explain, so I've posted two screenshots below to demonstrate. The first screenshot shows the navigation bar in Firefox, the second shows the same bar in Internet Explorer. I'm assuming this is probably something to do with the padding values I have assigned, but I have been unable to find a working solution for all browsers.

Also, I'm having a problem with the left margin of my main page content. The margins down the left side of the main page should all be 20px from the left hand border, and this shows correctly again in Firefox. However, in Internet Explorer, the left margin of the navigation bar appears correctly, but the content beneath it appears to have a much larger margin and as such the layout appears incorrectly.

If anyone has any idea how to fix these problems then I would very much appreciate the advice.

Thanks.

Sidebar Doesn't Display On One Page

Similar Tutorials

I use the same css for all page, but one of them doesn't show sidebar and push down the footer about 100px
Code:

http://elsoszabadmagyarkormany.com/torveny-szavazasok/

Anybody can help me?

If You Display: None An Image, Will It Load In The Page?

Similar Tutorials

If you display: none an image, will it load in the page?

That goes for any content, really... will it not load until you display: block it via javascript?

Page Doesn't Display The Same In Firefox As In Opera/ie6

Similar Tutorials

OK,

So I have put together what I thought was a reasonably basic xhtml page outline. I'm using a Win2k box. I checked it in Opera 7 and IE6 and it looks fine (more or less). I've also validated the xhtml and css codes. However, when I look at the page in Netscape 7.1 or Firefox, the menu kind of hangs a bit in limbo. Otherwise the rest of the page render's fine. I've included my code below. Does anyone have any suggestions since it's likely that if it doesn't work in Netscape/Firefox, it won't work in many other browsers either. Thanks!

Shawn

PS I'm not saying there is anything wrong with Firefox/Netscape, but likely my code

URL: http://www.raisetheratesottawa.org/xhtml/

=====
CSS
=====

HTML {
PADDING-RIGHT: 0px;
MARGIN-TOP: 0px;
PADDING-LEFT: 0px;
BACKGROUND-COLOR: #FF99CC;
MARGIN-BOTTOM: 20px;
PADDING-BOTTOM: 0px;
COLOR: #000000;
PADDING-TOP: 0px
}
BODY {
PADDING-RIGHT: 0px;
MARGIN-TOP: 0px;
PADDING-LEFT: 0px;
BACKGROUND-COLOR: #FF99CC;
MARGIN-BOTTOM: 20px;
PADDING-BOTTOM: 0px;
COLOR: #000000;
PADDING-TOP: 0px
}

#upper {
width:700px;
margin:0px auto;
text-align:left;
padding: 0px;
border: 5px solid #FFFFFF;
BACKGROUND-COLOR: #000000;
PADDING-RIGHT: 0px;
MARGIN-TOP: 0px;
PADDING-LEFT: 0px;
MARGIN-BOTTOM: 10px;
PADDING-BOTTOM: 0px;
PADDING-TOP: 0px
}

/* Horizontal nav */

#menu {
width:700px;
margin:0px auto;
padding: 0;
}

#menu ul {
border: 0;
margin: 0;
padding: 0;
list-style-type: none;
text-align: center;
clear: left;
}

#menu ul li {
display: block;
float: left;
text-align: center;
padding: 0;
margin: 0;
}

#menu ul li a {
background: #000000;
width: 175px;
/* was 'height: 2em; */
height: 24px;
padding: 0;
/* was 'margin: 0 0 10px 0;
' this affects the margin between upper menus*/
margin: 0 0 0 0;
color: #FF0000;
text-decoration: none;
display: block;
text-align: center;
font-weight: bold;
letter-spacing: 1px;
/* was 'line-height: 2em; */
line-height: 24px;
/* was 'font-size: x-small;
' */
font-size: 10px;
font-size: 10px;
/* was 'FONT: 8px Verdana, Arial, Helvetica, Sans-Serif;*/
}

#menu ul li#one {
width: 46px;
}
#menu ul li#two a {
width: 154px;
}
#menu ul li#three a {
width: 105px;
}
#menu ul li#four a {
width: 85px;
}
#menu ul li#five a {
width: 56px;
}
#menu ul li#six a {
width: 57px;
}
#menu ul li#seven {
width: 147px;
}

#menu ul li a:hover {
color: #000000;
background: #FF0000;
}

#menu a:active {
background: #c60;
color: #fff;
}

#content {
width:700px;
margin:0px auto;
text-align:left;
padding:0px;
border:5px solid #FFFFFF;
background: url(/xhtml/graph/rtr-logo-bk.gif) #FF99CC;
}

======
XHTML
======

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<title>Test</title>

<link rel="stylesheet" href="graph/rtrcss2.css" type="text/css" />

<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="en-us" />
<meta name="ROBOTS" content="No Index" />
<meta name="Copyright" content="Copyright (c) 2004" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="MSSmartTagsPreventParsing" content="true" />

<meta name="description" content="" />
<meta name="keywords" content="" />

<link rel="help" href="about.php" title="Site info." />

<meta name="Rating" content="General" />
<meta name="revisit-after" content="2 Days" />
<meta name="doc-class" content="Living Document" />

</head>

<body>

<div id="upper">

<div id="header">
<img src="graph/top-right2.jpg" width="700" height="78" alt="" />
</div>

<div id="menu"><ul>
<li id="one"> </li>
<li id="two"><a href="link1.php" title="Link 1.">Link 1</a></li>
<li id="three"><a href="link2.php" title="Link 2.">Link 2</a></li>
<li id="four"><a href="link3.php" title="Link 3.">Link 3</a></li>
<li id="five"><a href="link4.php" title="Link 4.">Link 4</a></li>
<li id="six"><a href="link5.php" title="Link 5.">Link 5</a></li>
<li id="seven"> </li>
</ul></div>
</div>

<div id="content">
<p>Here is some text</p>
<p>Here is some more text </p>
</div>

</body>
</html>

How I Display Output In Same Page On Click In Link

Similar Tutorials

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">

body {
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    background-color:#060606; background:url(images/background.png) repeat-y left top;
}

ul, ul li { margin:0; padding:0; list-style:none; }
ol, ol li { margin:0; padding:0; list-style:none; }
div { margin:0; padding:0; }
.clear { clear:both; }

.wrapper { width:100%; height:1000px; border:1px solid #FF0000;  }
.header_wrapper { background:url(images/banner_bg.png) no-repeat left top; height:115px; width:100%; border-bottom:2px solid #FCE66F; } 
.header_wrapper .header { width:906px; height:115px; margin:0 auto; outline:1px solid #0000FF;  }
.header_wrapper .header .logo { float:left; left:0; top:0; width:136px; }
.header_wrapper .header .title { float:left; margin-left:10px; padding-top:42px; width:491px; }
.header_wrapper .header .right { width:245px; height:115px; float:right; outline:1px solid #0000FF; position:relative; }
.header_wrapper .header .right .link { font:Tahoma, "Times New Roman", "Trebuchet MS", Verdana, Georgia, Arial, sans-serif; color:#F4E8D1; padding-top:28px; width:145px; height:20px; outline:1px solid #0033FF; position:absolute; right:0;    }
.header_wrapper .header .right .search { width:245px; height:35px; outline:1px solid #FF0000; position:absolute; bottom:20px; right:0; }

.header_wrapper .header .right .link ul li a { line-height:10px; border-left:1px solid #F4E8D1; float:left; text-decoration:none; margin-left:15px; padding-left:15px; color:#F4E8D1; }
.header_wrapper .header .right .link ul li.first a { border:none;  }
.header_wrapper .header .right .link ul li a:hover { text-decoration:underline; }




.container_wrapper { width:923px;  margin:0 auto; background:#060606; outline:1px solid #FF0000;  }
.container_wrapper .nav { margin:0 auto; padding-top:30px; width:923px; height:32px;   font:12px Tahoma, "Times New Roman", "Trebuchet MS", Verdana, Georgia, Arial, sans-serif;   }
.container_wrapper .nav ul { list-style:none; margin:0; padding:0;  }
.container_wrapper .nav ul li { display:inline;  margin-top:27px; }
.container_wrapper .nav ul li a { padding:17px 35px;  color:#FF6600; text-decoration:none;   }
.container_wrapper .nav ul li.first a { margin-left:30px; }
.container_wrapper .nav ul li a:hover { background:url(images/hover_button1.png) center center no-repeat; color:#FF6600; }

.container_wrapper .home_container { margin:0 auto; width:906px; outline:1px  solid #0000FF; position:relative; }
.container_wrapper .home_container .container_bg { background:url(images/body_bg.png) repeat-y left top;  }
.container_wrapper .home_container .left { float:left; width:219px; outline:1px solid #0000FF; margin-left:10px;    }
.container_wrapper .home_container .left .background { background:url(images/left_box_bg_img.png) repeat-y left top; }
.container_wrapper .home_container .left .background .title { font: bold 12px Verdana, Arial, Helvetica, sans-serif; color:#FDFD31; width:190px; border-bottom:2px solid #FF7811; margin-left:12px; padding-bottom:5px; padding-left:2px;    }
.container_wrapper .home_container .left .background .pruduct { width:190px; margin-left:12px; margin-top:5px; }
.container_wrapper .home_container .left .background .pruduct ul li { font:12px Verdana, Arial, Helvetica, sans-serif; color:#FFF500; padding-bottom:5px;  }
.container_wrapper .home_container .left .background .pruduct ul li a { color:#FFF500; text-decoration:none;  }
.container_wrapper .home_container .left .background .pruduct ul li a:hover {  color:#FFF500; text-decoration:underline; }

.container_wrapper .home_container .contain_box { float:left; width:400px; margin:0px 10px 0 10px; }
.container_wrapper .home_container .contain_box .contain_title { font:bold 14px Verdana, Arial, Helvetica, sans-serif; color: #FDFD31; padding:5px 0 8px 0; }
.container_wrapper .home_container .contain_box .text { font:12px Verdana, Arial, Helvetica, sans-serif; color:#ffffff; font-style:normal; text-align:justify; }

.container_wrapper .home_container .right { float:right; width:253px; outline:1px solid #0000FF;  }
.container_wrapper .home_container .right .right_box_bg { background:url(images/right_box_bg_img.png) repeat-y left top; }
.container_wrapper .home_container .right .right_box_bg .daily_news { width:195px; height:120px; outline:1px solid #00FF00; margin:0 auto; padding:0;  }
.container_wrapper .home_container .right .right_box_bg .daily_news .News_title { font: bold 24px "Times New Roman", Times, serif; color:#000000; text-align:center; border-bottom:2px solid #FA7815;   }
.container_wrapper .home_container .right .right_box_bg .daily_news .news_scroll { font:12px Verdana, Arial, Helvetica, sans-serif; text-align:center;  width:175px; padding-left:20px;  }


.container_wrapper .home_container .right .right_box_bg .login_nox { width:230px; height:200px; outline:1px solid #0000FF; margin:0 auto; margin-top:20px;  }

.footer { margin:0 auto; width:906px; height:73px;  background:url(images/footer2.png) no-repeat; margin-top:5px;  outline:1px solid #0000FF; text-align:center;  }
.footer ul li { font:12px "Times New Roman", Times, serif; color:#C1A579;  display:inline; line-height:80px; margin-left:20px; padding-left:20px;  }
.footer ul li a { font:12px "Times New Roman", Times, serif; color:#C1A579; text-decoration:none; }
.footer ul li a:hover { text-decoration:underline; }

</style>
</head>

<body>


<div class="wrapper">
    <div class="header_wrapper">
        <div class="header">
            <div class="logo"><img src="images/logo.png" height="171" width="136"/></div>
            <div class="title"> <img src="images/banner_title.png" width="500" height="56" /></div>
            <div class="right">
                <div class="link">
                    <ul>
                        <li class="first"><a href="">Register</a></li>
                        <li><a href="">Login</a></li>
                    </ul>
                </div>
                <div class="search">
                    <table width="245">
                        <tr>
                            <td><img src="images/search_bg.png" width="179" height="27" /></td><td> <img src="images/go_button.png" width="49" height="29" /></td>
                        </tr>
                    </table>
                </div>
                <div class="clear"><!-- --></div>
            </div>
            <div class="clear"><!-- --></div>
        </div>
    </div>
    
    
    
    
    
    <div class="container_wrapper">
    <div class="nav"> 
        <ul>
            <li class="first"><a href="#">Home  </a></li>
            <li><a href="#">Voluntee </a></li>
            <li><a href="#">About Us </a></li>
            <li><a href="#">Events</a></li>
            <li><a href="#"> Donate </a></li>
            <li ><a href="#"> Carrier with us</a></li>
        </ul>    
    </div>
    
    <div class="clear"><!-- --></div>
    <div class="home_container">
        <div><img src="images/body_top.png" width="906" height="12"></div>
        <div class="container_bg">
        <div class="left">
            <div><img src="images/left_box_top_img.png" width="219" height="14" /></div>
            <div class="background">
                <div class="title">EVENTS</div>
                    <div class="pruduct">                    
                        <ul>
                            <li>* <a href="#">Whatexpect on Sundays</a></li> 
                            <li>* <a href="#">Location and directions</a></li> 
                            <li>* <a href="#">Where to go to wear</a></li> 
                            <li>* <a href="#">What  for your child</a></li> 
                            <li>* <a href="#">Meet the staff</a></li> 
                            <li>* <a href="#">ExploreFaith.org</a></li> 
                            <li>* <a href="#">Mission Opportunities</a></li> 
                        </ul>    
                    </div>
            </div>            
            <div><img src="images/left_box_bottom_img.png" width="219" height="15" /></div>
        </div>
        
        
        <div class="contain_box">
                <div class="contain_title">Welcome to Elite Brigade</div>
                <div class="text">
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.<br>
<br>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
                </div>
        </div>
        <div class="right">
            <div> <img src="images/right_box_top_img.png" width="253" height="18" /></div>
            <div class="right_box_bg">
                    <div class="daily_news">
                        <div class="News_title">Daily News</div>
                        <div class="news_scroll">

  <marquee height="80" behavior="scroll" direction="up" scrolldelay="50" truespeed="truespeed" scrollamount="1"  onmouseover="this.stop()" onmouseout="this.start()" >

Put Your Images tag here

</marquee>                        
                        </div>
                    </div>
                    <div class="login_nox"></div>            
            </div>
            <div><img src="images/right_box_bottom_img.png" width="253" height="17" /></div>
        </div>        
        <div class="clear"><!-- --></div>    
        
        
        </div>
        <div><img src="images/body_bottom_.png" width="906" height="23"/></div>    
     </div>
    
    
        <div class="clear"><!-- --></div>
    <div class="footer">
        <ul>
            <li><a href="#">About Us</a></li>
            <li><a href="#">Contact us</a></li>
            <li><a href="#">Privacy Policy</a></li>
            <li><a href="#">Copyright statement</a></li>
        </ul>    
    </div>
    
    </div>
    
    </div>
</div>

</body>
</html>

Quote:
Hi Friends...........
Above code is an home page of website and I want that when user clicks on register link, the registration form(PHP File) displays below "Welcome to Ankit" by replacing "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.<br>
<br>
<span style="font-weight: bold">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum."</span>
instead of another page.
Anyone plz help me??????????????
Thx in advance............

Please Help! Urgent! Need To Display Logo And Menu On Each Page By Defaul

Similar Tutorials

Hi,

I'm new using CSS and was just handed the task of creating an external style sheet that will 'brand' the web page of a new service we are using with my company's logo and menu.

Our page has a logo on the left, with a menu bar extending to the right of it, then a graphic bannner with the company's slogan below all of it.

The requirements are for an external style sheet which will apply this to each page of the services hosted pages.

I desperately need an example of how this is done, or CAN it be done with an external style sheet (and what code needs to go into the HTML file to make it work).

Any help would be greatly appreciated. I've spent 4 days searching for an example and have come up dry, or what I did find didn't work. This is my last resort and I need to finish the project today.

Tillius

Css Display Problem

Similar Tutorials

Code:

<!-- #Include virtual="/webcontent/doctype.txt" -->
<html>
<head>
<!-- #Include virtual="/tagsm.htm" -->
<!-- #Include virtual="/webcontent/cssinclude.htm" -->
<title>EPIC Performance</title>

<SCRIPT LANGUAGE="JavaScript" SRC="/webcontent/nav.js">
</SCRIPT>
</head>
<body>
 
<div class="wrapper">
	<div class="lefthandnav">
		<div class="headerimgleft">

			EPIC LOGO
		</div>

	<div class="bl"><div class="br"><div class="tl"><div class="tr">
			<a href="index.shtml">Home </a><br/>
			<a href="login.asp">Log In </a><br/>
			<a href="shopping.asp">Products</a><br/>
			<a href="history.shtml">History</a><br/>

			<a href="podcasts.shtml">Podcasts</a><br />
			<a href="news.asp">News</a><br />
			<a href="faq.asp">FAQ</a><br />
			<a href="contact.shtm l">Contact Us</a><br/>

				
</div></div></div></div>
<div class="clear">&nbsp;</div>
		
		
	<div class="bl"><div class="br"><div class="tl"><div class="tr">

			<b>Sponsors</b><br/><br/>
			
				<p><img src="/images/PowerLift_logo.jpg"></p>
				<p><img src="/images/Uesaka_logo.jpg"></p>
</div></div></div></div>
<div class="clear">&nbsp;</div>


<div class="bl"><div class="br"><div class="tl"><div class="tr">
			<b>EPIC Athletic Performance Inc.</b><br/>
			P.O Box 61689<br/>

			Colorado Springs, CO 80906<br/>

			<b>epicindex.com</b>
</div></div></div></div>
<div class="clear">&nbsp;</div>


	</div>

	<div class="righthandnav">
		<hr class="topline"/>

			<h2 class="headingtitle">Evaluate and Improve Athletic 
Performance</h2>
		<hr class="topline"/>

		<div id="menu">
	
	<dl>			
		<dt onmouseover="javascript:montre('smenu5');">Testing</dt>
			<dd id="smenu5">
				<ul>
					<li><a href="#">Talent Identification</a></li>
					<li><a href="#">Big 33</a></li>
					<li><a href="#">Test Procedures</a></li>
					<li><a href="#">Test Equipment</a></li>
					<li><a href="#">Test Card</a></li>
				</ul>
			</dd>
	</dl>
	

	<dl>			
		<dt onmouseover="javascript:montre('smenu1');">Evaluation </dt>
			<dd id="smenu1">
				<ul>
					<li><a href="#">Five Star Rating</a></li>
					<li><a href="#">Vertical Jump Index</a></li>
					<li><a href="#">Talent Identification Index</a></li>
					<li><a href="#">Individual Index</a></li>
					<li><a href="#">Multiple Test History</a></li>
					<li><a href="#">Team Data</a></li>
				</ul>
			</dd>
	</dl>
	
	
	<dl>	
		<dt onmouseover="javascript:montre('smenu2');">Goals</dt>
			<dd id="smenu2">
				<ul>
					<li><a href="#">Setting Goals</a></li>
					<li><a href="#">Six Weeks</a></li>
					<li><a href="#">High School</a></li>
					<li><a href="#">College</a></li>
					<li><a href="#">Pyramid Poster</a></li>
				</ul>
			</dd>
	</dl>
	
	<dl>	
		<dt onmouseover="javascript:montre('smenu3');">Program</dt>
			<dd id="smenu3">
				<ul>
					<li><a href="#">Selecting a Program</a></li>
					<li><a href="#">Strength Disk</a></li>
					<li><a href="#">Books</a></li>
					<li><a href="#">CD's</a></li>
					<li><a href="#">Videos</a></li>
	<li><a href="#">Posters</a></li>
	<li><a href="#">Nutrition</a></li>
	<li><a href="#">Make the Play Clinic</a></li>
	<li><a href="#">Performance Speakers</a></li>
	<li><a href="#">Program Equipment</a></li>
				</ul>
			</dd>
	</dl>
	
	<dl>	
		<dt onmouseover="javascript:montre('smenu4');">Equipment</dt>
			<dd id="smenu4">
				<ul>
					<li><a href="#">Program Equipment</a></li>
					<li><a href="#">Testing Equipment</a></li>
					<li><a href="#">Clothing</a></li>
				</ul>
			</dd>
	</dl>
	
</div>



	</div>

	
</div>

</body>
</html>

the problem is when you look at the website in mozilla and IE

I like the way it looks in mozilla but when you look in IE the top navigation is not aligning properly

there is a problem with the HR tag

here is the CSS code
Code:

body
{
margin: 0;
padding: 0;
font-family: arial; 
color: #000;
}
.wrapper {
width: 900px;
height:605px;
}

.lefthandnav
{
float: left;
width: 145px;
background-color:white;
padding:0px 5px 0px 0px;
}
.righthandnav
{
float: left;
width: 745px;
background-color:white; 
padding: 0px 0px 0px 5px
}

.headerimgleft
{
height:75px;
}

.clearing
{
clear:both;
}

.headingtitle
{
 font-weight: bold;
font-size: 15;
text-align:center;
}

.topline
{
margin: 0;
padding: 0;
width:94.3%;
margin:0px;
color: #CC0000;
background-color: #CC0000;
height: 5px;

}
.bl {background: url(bl.gif) 0 100% no-repeat #e68200;}
.br {background: url(br.gif) 100% 100% no-repeat}
.tl {background: url(tl.gif) 0 0 no-repeat}
.tr {background: url(tr.gif) 100% 0 no-repeat; text-align:center;padding:5px}
.clear {font-size: 1px; height: 1px}

dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute;
padding:5px 0px 0px 0px;
}
#menu dl {
float: left;
width: 8.7em;
margin: 0 1px;
}
#menu dt {
cursor: pointer;
text-align: left;
font-weight: bold;
background: #CC0000;
border: 1px solid gray;
}
#menu dd {
border: 1px solid gray;
}
#menu li {
text-align: left;
background: #fff;
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}
#menu li a:hover, #menu dt a:hover {
background: #eee;
}

#site {
position: absolute;
z-index: 1;
top : 70px;
left : 10px;
color: #000;
background-color: #ddd;
padding: 5px;
border: 1px solid gray; 
}

a {text-decoration: none;
color: black;
color: #222;
}

any idea why its doing like that

todd

Display:none Problem

Similar Tutorials

i have some tables done on my site with the display:none property. when you make a selection from the drop-down list, that table appears. my problem is that when page refreshes all object hide again. i use a javascript case statement to display the correct selection from the drop-down box. any ideas??

Ie7 Display Problem

Similar Tutorials

I have a small problem with the login bar on my homepage. In IE it decides to pad extra space on the bottom , however in Firefox all is displayed ok. Please visit www.wecook.co.uk to see the problem. I think the problem is this bit of css

Code:


#login
{
  width: 736px;
  background-color: #e4e2df; 
  border-left: 1px solid #000000; 
  border-right: 1px solid #000000; 
  border-top: 1px solid #000000; 
  padding-top: 1px;
  padding-bottom: 1px;
  text-align: right;
}

label:after 
{
 content: ": ";
}

label 
{
  color: black;
  font-weight: bold;
  padding: 1px;
  text-transform: uppercase;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 8px;
}  

input 
{
  display: block;
  width: 100px;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: xx-small; 
  padding: 4px;
  border: solid black;
  border-width: 1px 2px 2px 1px;
}

.buttonLogin 
{
  width: 60px;
  color: black;
  text-transform: uppercase;
  border: 1px solid #5C5C5C; 
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 8px;
  text-align:center;
}

Offending bit of HTML

Code:


 <!-- If no cookies display login bar -->

<!-- start login -->
<div id = "login">
		    
<form action="Login.do" method="post">
<table width="736" border="0" cellspacing="0" cellpadding="0">

<tr>

    <td width="445" align="right">&nbsp;</td>
         <td width="112" align="center">   
	          		<input name="uname" type="text"    id="uname" value="Username" size = "10"  /> <br />
		    	</td>
            	<td width="112" align = "center"> 
			  		<input name="pword" type="password"   id="pword" value="Password" size = "10"  />  <br />	        
				</td>
            	<td width="67" align = "center" valign="bottom"> 
		    		<input type="submit" name="Login" value="Login" class="buttonLogin" />	</td>

          		</tr>
          		</table>
          		</form>	

		 	   <!-- end login -->  
		       </div>

Any help is appreciated. Thanks.

I think its to do with the login button - but dont know how to fix it.

Ie6 Div Display Problem

Similar Tutorials

I am having CSS DIV issues with IE6.
When dislayed in Firefox, IE7, IE8 it is fine, but my nice rounded boxes look like crap in IE6. I've attached a screen shot of the box as it looks in IE6

Code:

<!-- CONTENT BEGIN -->
<div id="box1" >				
<div id="lb" ><div id="rb"><div id="bb"><div id="blc">
<div id="brc"><div id="tb"><div id="tlc"><div id="trc">
<br />
<span class="style1" style="padding-left: 15px"><?php echo $Title; ?></span>
 <br />
 <br />
</div>
</div></div></div></div>				
</div></div></div></div>

**the middle divs are all the corners for borders

box1 css
Code:

 #box1 	{ 	
position: relative; 	
margin-left: 5px; 	margin-right: auto;	 	
margin-top: 1em; 	
padding: 0; 	
text-align: left; 	
//width:100%; /* <-- use this to tie width to viewport size*/ 	
width: 55em; /* <-- use this for a set width */ 
background-color: #eeeeee;;
 	}

Ie6&7 Problem With Display

Similar Tutorials

Hi all.
I got problem with display content in IE 6 and 7, It throws the content totally on left side, while in firefox its on center, like it should be.

I think problem could be he

#countrydivcontainer
{

text-align: left;
margin-top: 0pt;
margin-right: auto;
margin-bottom: 0pt;
margin-left: auto;
width: 965px;
color: #666666;
clear: both;
padding-top: 20px;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;

}

Unfortunately i dont know how to explain the problem without the url to really see it
Can someone help?

Ie Display Problem

Similar Tutorials

I'm having some issues with website I'm putting together. Don't flame me for the code, it started as exported code from Photoshop. I need to get it up quick, after that, I'll convert it over to full CSS.

http://www.foltzconstruction.com

Try navigating to one of the subpages. Everything displays perfect in FF, but wrong in IE.

Anyone got any clues as to why?

I've attached my CSS file to make your life a little easier.

Thanks, guys.

Display Problem In Ie 6

Similar Tutorials

I have a page that seems to display well in most browsers except in IE 6 (and possibly below). The content that should appear in the right_sidebar is shifted to the bottom left of the page. Dreamweaver has shown a "three-pixel text jog" error. I have read several articles on the IE bugs especially the ones at positioneverything.com but I still can't solve my problem.

This seems to be the suggested fix, but I apparently am not applying it correctly:
Code:

<!--[if IE]>
<style type="text/css"> 
/* place css fixes for all versions of IE in this conditional comment */
#column, #right_sidebar { zoom: 1; }
/* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
</style>
<![endif]-->

Display Css Problem

Similar Tutorials

Hi,

I have this code and i need some text next to the drop down. I am attaching the image how it looks like

the text " Hold Ctrl key 4 multiple " is next to the drop down and it sticks to the drop down i need some space between the text and drop down and its not working here is the css code

The text scorlls next to the drop down and i want the space to be uniform on the 3 lines where the text scrolls down
also can i have Hold Ctrl key 4 on one line and then multiple on the second line

thank you

princecharles

Code:


.credfont
{

font-weight:bold;
font-size:12px;
padding:0px 0px 0px 4px;
color: #f00;
}

<tr class="oddrow"> 
<td class="lbl" width="152">Subjects:&nbsp;</td>
<td width="170"><span style="float:left;"><select  name="Subjects" id="Subjects" multiple="multiple" size="2">

<option>Maths</option>
<option>Science</option>
<option>PT</option>
<option>Arts</option>

</select>  </span> <span class="credfont">( Hold Ctrl key 4 multiple )</span>

</td>

<td class="lbl" width="92" > Class:&nbsp;</td>
<td colspan="2"> <input type="text" class="writein"  name="class" id="class" size="30" value=""> 
</td>
</tr>

Problem With Display:blocks;

Similar Tutorials

Code:

a {
display:blocks;
width:100px;
height:20px;
border:1px solid #000000;
background:#CCCCCC;
}

This code works great in Internet Explorer, but Firefox doesn't seem to like the width and height settings. Does anyone know a way to do this in firefox?

Thanks in advance!

Link Display Problem In Ie

Similar Tutorials

the website http://www.mostardesigns.com/4five1/ the top menu links work ok in firefox but in IE they wont display, here is my css code for the links:
Code:

	a.a_bannerLink:link, a.a_bannerLink:visited, a.a_bannerLink:active	{
		color:#FFFFFF;
		text-decoration:none;
		font-size:12px;
		font-weight:bold;
		padding:6px 15px 6px 15px;
		display:block;
		}
	a.a_bannerLink:hover	{
		color:#FFFFFF;
		text-decoration:none;
		font-size:12px;
		padding:6px 15px 6px 15px;
		background-image:url(../images/link_bg.jpg);
		background-repeat:repeat-x;
		display:block;
		}

any help is appreciated, thanks in advance.

Html Display Problem

Similar Tutorials

hello gurus

i am having a problem with my autosfill script .. i am using pHP as a server side.

while i am filling a text box i can see a available records froms the db. but it shows html

elements are getting displayed over div box (records)

i am attaching image so you will get exact idea.

is there any css property available so that i can display this properly?