PDA

View Full Version : When I change the CSS on one page it changes on all the others too?


PasteyC
05-27-2011, 08:40 PM
When I change the CSS on one page it changes on all the others too?

I just want to change the text format on one particular page instead of all of them at once. But when i change on one page it does the same on another page...

Please help!

Thanks,
Cam

gentleone
05-27-2011, 09:29 PM
When I change the CSS on one page it changes on all the others too?
That's the whole idea behind CSS.

If you want to to target a specific page you can give the body tag an ID.

<body id="about-us">
<div id="content>
<p>some text</p>
</div>
</body>

CSS:

body#about-us #content p {color: #FF0000}

PasteyC
05-27-2011, 09:37 PM
gentleone, im still very new to all of this. <!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" xml:lang="en" lang="en">
<head>
<title>Free business template #47</title>
<link rel="stylesheet" media="screen" type="text/css" href="style.css" />
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
</head>

<body>
<div id="container">
<div id="body_space">
<div id="header">
<div id="logo-block">
<!-- type your logo and small slogan here --><img src="images/Untitled-3.jpg" width="531" height="108" /> <!-- end logo and small slogan -->
</div>
<div id="definels">
<!-- login -->
<div id="login_top">
<p>login:&nbsp;&nbsp;</p>
<form name="login" method="get" action="" target="_parent">
<input name="name" type="text" value="username" class="topinputstyle" />
<p>&nbsp;&nbsp;</p>
<div class="formspace"><input name="email" type="text" value="password" class="topinputstyle" /></div>
<p>&nbsp;&nbsp;</p>
<div class="formspace"><input type="submit" value="" class="loginbutton" /></div>
</form>
</div>
<!-- end login -->
<!-- search -->
<div id="search">
<form name="search" method="get" action="" target="_parent">
<input type="text" class="box" />
<button class="btn" title="Submit Search">Search</button>
</form>
</div>
<!-- end search -->
</div>
<div class="cls"></div>
<div id="top-nav-bg">
<div id="top-nav">
<!-- start top navigation bar -->
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="Products.html">Products</a></li>
<li><a href="Services.html">Services</a></li>
<li><a href="Feedback.html">Feedback</a></li>
<li><a href="Aboutus.html">About Us</a></li>
<li><a href="Contact.html">Contact</a></li>
<li><a style="background-image: none;" href="Support.html">Support</a></li>
</ul>
<!-- end top navigation bar -->
</div>
</div>
</div>
<div id="clouds">
<!-- large slogan here -->
<div id="clouds-slogan1"><p>&nbsp;</p></div>
<div id="clouds-slogan2"></div>
<!-- end large slogan -->
</div>
</div>
</div>
<div id="page">
<div id="page-padding">
<!-- start content -->
<div id="content">
<div id="content-padding">
<h1>About Us</h1>
<p>&nbsp;</p>
<p> Since 1956, Suntoya has been representing the leading manufacturers' in the plumbing and heating industry. *Our staff have been trained on all our our product lines, and understand how these products can be applied to complete your system.<br />
<br />
We are committed to:<br />
<br />
Meeting and exceeding our customers’ and suppliers’ needs<br />
Providing excellent and consistent customer support<br />
Expanding to provide more products and services </p>
</div>
</div>
<!-- end content -->
<div id="right-nav">
<!-- right side menu, copy and paste what is contained between these start and end comment tags to make an extra menu -->
<div class="right-nav-back">
<div class="right-nav-top"><p>. : Our Services</p></div>
<ul>
<li><a href="http://www.suntoya.comeze.com/images/linecard.jpg">Linecard</a></li>
<li><a href="plumbing.html">Plumbing Products</a></li>
<li><a href="hydronic.html">HVAC Products</a></li>
<li><a href="radiantheat.html">Radiant Heat Products</a></li>
<li><a href="hydronic.html" style="background-image: none;">Hydronic Piping Products</a></li>
</ul>
<br /><br /><br />
<div class="right-nav-bottom"></div>
</div>
<!-- end right side menu -->
<!-- start second menu for the newletter -->
<div class="right-nav-back">
<div class="right-nav-top"><p>. : Subscribe to our Newsletter</p></div>
<br />
<div id="subscribe">
<form action="yourformmailhere" enctype="multipart/form-data" method="post">
<input type="hidden" name="sendtoemail" value="youremailaddress" />
<input type="hidden" name="redirect" value="yourwebsiteaddress" />
<input type="hidden" name="subject" value="Newsletter subscription from your website" />
<input name="name" type="text" value="Your name" class="inputstyle" />
<input name="email" type="text" value="Your email address" class="inputstyle" />
<input type="submit" value="subscribe" class="button" />
</form>
</div>
<div class="right-nav-bottom"></div>
</div>
<!-- end second right side menu, newletter -->
<br /><br /><br /><br /><br /><br />
</div>
</div>
<div id="footer">
<div id="footer-pad">
<div class="line"></div>
<!-- footer and copyright notice -->
<p>This site is &copy; Copyright www.suntoya.com 2011, All rights reserved. Design by <a href="cam@suntoya.com">Cam@suntoya.com</a></p>
<!-- end footer and copyright notice -->
</div>
</div>
</div>
</body>
</html>

There is my code. exactly where would i ad that id tag?

PasteyC
05-27-2011, 09:41 PM
where exactly do i add that ID. I'm new to Dreamweaver!!!

gentleone
05-27-2011, 10:05 PM
above your <div id="container"> you see <body>
assign an ID to that <body>

PasteyC
05-27-2011, 10:10 PM
im completely lost. I found the <div id and i put my id above that next to the <body>. I tested it by simply changing the headline title color to red on dreamweaver and its still changing all the other headlines on other pages to red. Is there anyway i could email you my code and you could point out exactly what i need to do. I really appreciate all your help gentleone!!!

email: cam@suntoya.com
the website im designing is mocked up on a free domain you can view it here: www.suntoya.comeze.com

Thanks again gentleone,
Cam

PasteyC
05-27-2011, 10:36 PM
could i email you my code? they keep deleting my post when i post my email... I added that to my body above container but it didnt work.

edbr
05-28-2011, 01:37 AM
it wasnt deleted but the auto filters put it into moderation. ive approved it now

PasteyC
05-28-2011, 01:39 AM
thank you edbr!