Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

CSS not working with HTML...

Posted on 2010-11-24
4
Medium Priority
?
309 Views
Last Modified: 2012-05-10
Somehow the theml is not picking up the CSS...I included both...its not formatting the sections...

---

body
        {
            background-color:white;
            font:14px Georgia,Serif;
        }
        .content
        {
            width:1700px;
            margin:auto;
            border-style:2px solid black;
            background-color:white;
            padding:10px;
        }
        .header
        {
            width:1700px;
            height:100px;
            border:1px solid grey;
        }
        .breadCrumb
        {
            width:1700px;
            height:30px;
            border:1px solid red;
        }
        .menu
        {
            width:1700px;
            height:30px;
            border:1px solid blue;
        }
        .centerSection
        {
            width:700px;
            height:302px;
        }
        .leftSide
        {
            width:548px;
            height:300px;
            border:1px solid green;
            float:left;
        }
        .mainContent
        {
            width:548px;
            height:300px;
            border:1px solid orange;
            float:right;
        }
        .upperFooter
        {
            width:1700px;
            height:80px;
            border:1px solid brown;
        }
        .footer
        {
            width:1700px;
            height:60px;
            border:1px solid grey;
        }

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
	<title>Design 1</title>


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

	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

	<script type="text/javascript" src="flexdropdown.js">

	/***********************************************
	* Flex Level Drop Down Menu- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
	* This notice MUST stay intact for legal use
	* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
	*
	* http://dynamicdrive.com/dynamicindex1/flexdropdown.htm
	*
	***********************************************/

</script>



</head>


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

<body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">




<!-- HTML for Flex Drop Down Menu 1 ___ NEW SECTION________________________________________________________________ -->
<ul id="flexmenu1" class="flexdropdownmenu">
<li><a href="http://www.dynamicdrive.com/">Item 1a</a></li>
<li><a href="http://www.cssdrive.com">Item 2a</a></li>
<li><a href="http://www.javascriptkit.com">Item Folder 3a</a>
	<ul>
	<li><a href="http://www.codingforums.com">Sub Item 3.1a</a></li>
		<ul>
		<li><a href="http://www.javascriptkit.com/domref/">Sub Item 3.1a</a></li>
		<li><a href="http://www.codingforums.com">Sub Item 3.2a</a></li>
		<li><a href="http://www.codingforums.com">Sub Item 3.3a</a></li>
		<li><a href="http://www.cssdrive.com">Sub Item 3.4a</a></li>
	</ul>
	<li><a href="http://www.codingforums.com">Sub Item 3.2a</a></li>
	<li><a href="http://www.cssdrive.com">Sub Item 3.3a</a></li>
	<li><a href="http://www.codingforums.com">Sub Item 3.4a</a></li>
	</ul>
</li>
<li><a href="http://www.cssdrive.com">Item 4a</a></li>
<li><a href="http://www.codingforums.com">Item Folder 5a</a>
	<ul>
	<li><a href="http://www.codingforums.com">Sub Item 5.1a</a></li>
	<li><a href="http://www.codingforums.com">Item Folder 5.2a</a>
		<ul>
		<li><a href="http://www.cssdrive.com">Sub Item 5.2.1a</a></li>
		<li><a href="http://www.codingforums.com">Sub Item 5.2.2a</a></li>
		<li><a href="http://www.codingforums.com">Sub Item 5.2.3a</a></li>
		<li><a href="http://www.codingforums.com">Sub Item 5.2.4a</a></li>
		</ul>
	</li>
	</ul>
</li>
<li><a href="http://www.codingforums.com">Item 6a</a></li>
</ul>




<!-- NEW SECTION________________________________________________________________ -->

<div id="left_side">






</div>








<!-- NEW SECTION________________________________________________________________ -->

<div id="content">


</div>






<!-- NEW SECTION________________________________________________________________ -->

<div id="menu">
<table width="770" cellspacing="0" cellpadding="0" border="0">

	<tr>
	    <td valign="top" bgcolor="#F9E855">
<!-- menu start -->

<a href="http://www.dynamicdrive.com" data-flexmenu="flexmenu1" data-dir="h" data-offsets="8,0">Super Menu</a>

<!-- menu end -->

</div>









<!-- NEW SECTION________________________________________________________________ -->

<div id="breadCrumb">


		</td>
		<td bgcolor="#000000" valign="top">
<!-- center column start -->
		<img src="images/spacer_white.gif" width="1" height="265" alt="" border="0"></td>
<!-- center column end -->

</div>




<!-- NEW SECTION________________________________________________________________ -->

<div id="centerSection">


		</td>
	    <td valign="top">
<!-- content area start -->
			<table width="100%" cellspacing="0" cellpadding="0" border="0">
				<tr>
				    <td colspan="2"><img src="images/engulf_upper.gif" width="623" height="42" alt="" border="0"></td>
				</tr>
				<tr>
				    <td valign="top"><img src="images/engulf_lower.gif" width="341" height="224" alt="" border="0"></td>
				    <td><img src="images/hand.jpg" width="282" height="224" alt="" border="0"></td>
				</tr>
				<tr>
					<td colspan="2" bgcolor="#F9E855">


</div>


<!-- NEW SECTION________________________________________________________________ -->

<div id="upper_footer">
<!-- footer start -->
		upper_footer  &nbsp;&nbsp;&nbsp;
<!-- footer end -->

</div>




<!-- NEW SECTION________________________________________________________________ -->

<div id="main_content">



<!-- title and text start -->

						<table width="100%" cellspacing="0" cellpadding="0" border="0">
							<tr>
								<td colspan="8"><img src="images/title.gif" width="623" height="38" alt="" border="0"></td>
							</tr>
							<tr>
							    <td>&nbsp;</td>
							    <td bgcolor="#000000"><img src="images/spacer.gif" width="1" height="101" alt="" border="0"></td>
							    <td>&nbsp;</td>
							    <td valign="top"><br>Text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text, text,
text, text, text, text, text, text, text, text, text, text, text, text, text,
text, text, text, text, text, text, text, text, text, text, text, text, text, text.</td>
							    <td>&nbsp;</td>
							    <td bgcolor="#000000"><img src="images/spacer.gif" width="1" height="1" alt="" border="0"></td>
							    <td>&nbsp;</td>
							    <td bgcolor="#000000"><img src="images/spacer.gif" width="1" height="1" alt="" border="0"></td>
							</tr>
							<tr>
							    <td><img src="images/spacer.gif" width="82" height="1" alt="" border="0"></td>
							    <td bgcolor="#000000"><img src="images/spacer.gif" width="1" height="1" alt="" border="0"></td>
							    <td><img src="images/spacer.gif" width="13" height="1" alt="" border="0"></td>
							    <td><img src="images/spacer.gif" width="455" height="1" alt="" border="0"></td>
							    <td><img src="images/spacer.gif" width="13" height="1" alt="" border="0"></td>
							    <td bgcolor="#000000"><img src="images/spacer.gif" width="1" height="1" alt="" border="0"></td>
							    <td><img src="images/spacer.gif" width="57" height="1" alt="" border="0"></td>
							    <td bgcolor="#000000"><img src="images/spacer.gif" width="1" height="1" alt="" border="0"></td>
							</tr>
						</table>
<!-- title and text end -->



</div>











		</td>
	</tr>
	<tr>
		<td bgcolor="#000000"><img src="images/spacer.gif" width="146" height="1" alt="" border="0"></td>
		<td bgcolor="#000000"><img src="images/spacer.gif" width="1" height="1" alt="" border="0"></td>
		<td bgcolor="#000000"><img src="images/spacer.gif" width="623" height="1" alt="" border="0"></td>
	</tr>
	<tr>
		<td colspan="3" align="right" style="color: #80838E">



<!-- NEW SECTION________________________________________________________________ -->

<div id="upper_footer">
<!-- footer start -->
		© copyright 2002 | your company name | all rights  reserved&nbsp;&nbsp;&nbsp;
<!-- footer end -->

</div>




<!-- NEW SECTION________________________________________________________________ -->

<div id="footer">
<!-- footer start -->
		© copyright 2002 | your company name | all rights  reserved&nbsp;&nbsp;&nbsp;
<!-- footer end -->

</div>




<!-- ________________________________________________________________ -->





		</td>
	</tr>
</table>
</div>
</body>
</html>

Open in new window

0
Comment
Question by:GlobaLevel
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
4 Comments
 
LVL 9

Expert Comment

by:Vampireofdarkness
ID: 34208385
You have the CSS declared as classes, but are using id='' in your HTML. If you want to define it by id, use #leftSide instead of .leftSide.

You also have the incorrect names used in your HTML -- you have used id='left_side' instead of id='leftSide'
0
 
LVL 30

Expert Comment

by:LZ1
ID: 34208394
I would definitely start by validating your code, fixing it and then see what's wrong.  You do have some very messy code(no offense), that you really should clean up.
When I validated by direct input I found 24 errors and 3 warnings
http://validator.w3.org/
0
 
LVL 14

Expert Comment

by:Designbyonyx
ID: 34208816
For starters, your <link> tag (line 30) for the CSS file should be located INSIDE the HEAD.  Right now, it is not inside of anything... which is extremely wrong.

Try putting your CSS file (line 30)  at the top of your HEAD (line 7)
0
 
LVL 1

Accepted Solution

by:
ACEAFTY earned 2000 total points
ID: 34217396
If the css is TOTALLY not working then it can be that your href="" path is wrong. Where is your CSS file situated in your directory?. Can you provide a tree structure of your directory showing where each file is sitting?
0

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

722 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question