Hi Guys,
I am using a third party gallery generator on my site, but the CSS it uses is messing up my navigation bar. Question is, can I hide the nav bar from the control of the style sheet that looks after the gallery? The nav bar is common to all pages in my site and has been added to the gallery page by PHP include ().
Any suggestion - keep 'em simple.
Thanks
Apply style to part of page
Welcome to the Forum,
Give us a link to your site so we can view first hand before guessing with a solution that could ruin something else.
Good luck.
Apply style to part of page
Hi rewmer,
Not enough detail really, could do with seeing the styles, but off hand you will probably need to ensure that the styles are targeted using ID names to ensure that rules are specific to an element . make sure that your nav rules are specific and carry more weight than any possible conflicting rules i.e
body #somediv #navbar ul {}
Hugo.
Apply style to part of page
http://www.genetic-gems.com/gallery/index.php
This is the page with the problem, I have disabled the navbar at present because it renders the page unusable. What happens is the spacer images in the navbar get expanded so the whole thing is about 1200px wide, also the drop down menus look a lot bigger than they should be.
This is the CSS for the gallery
http://www.genetic-gems.com/gallery/assets/general.css
This is the navbar
http://www.genetic-gems.com/navigation/navbar.php
When viewed in Firefox everything is fine, it seems to be IE and NsNg that are the problem
[/url]
Apply style to part of page
<!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" xml:lang="en" lang="en"> --> <head> <title>Available now</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> </head> <body> <!-- Your content can be inserted here --> <hr width=725 color="#764E71" size="3"> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> <!-- } .style1 {font-family: Tahoma} .style3 { font-size: 14px; color: #764E71; font-weight: bold; } .style4 { font-family: Tahoma; font-size: 14px; color: #764E71; font-weight: bold; } --> </style> </head>
Ooooh no, that's not right
<!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" xml:lang="en" lang="en"> <head> <title>Available now</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> <!-- } .style1 {font-family: Tahoma} .style3 { font-size: 14px; color: #764E71; font-weight: bold; } .style4 { font-family: Tahoma; font-size: 14px; color: #764E71; font-weight: bold; } --> </style> </head>
I wondered why you commented out the <html> tag?
CSS and includes
If I have commented out the <html> tag, I didnt realise.
this is all a bit new to me. I have been trying to pick up PHP, CSS, MYSQL, FLASH and Parenting a two week old son in the past three weeks- perhaps some more concentration required ?. I will take onboard your comments and code and have another look, thanks for taking the time to help.
I will try to upload a demo page that shows the problem in the next couple of days - will post a link if succesful
update - here is the link to test pagehttp://www.genetic-gems.com/gallery/test.php
Apply style to part of page
Ooooh, you've still got that messed up stuff at the top I posted what it should look like.
Apply style to part of page
OK, modified as shown - no effect though?
Did someone say this was easy??........
Apply style to part of page
It's still wrong.
Remove the bold bit:
<!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" xml:lang="en" lang="en">
<head>
<title>Available now</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
}
.style1 {font-family: Tahoma}
.style3 {
font-size: 14px;
color: #764E71;
font-weight: bold;
}
.style4 {
font-family: Tahoma;
font-size: 14px;
color: #764E71;
font-weight: bold;
}
</style>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
}
.style1 {font-family: Tahoma}
.style3 {
font-size: 14px;
color: #764E71;
font-weight: bold;
}
.style4 {
font-family: Tahoma;
font-size: 14px;
color: #764E71;
font-weight: bold;
}
-->
</style>
</head>
<body>
Apply style to part of page
oooopsy,
Ok, done that. Still looks the same........
Apply style to part of page
Err you still appear to have two doctypes, two heads, two bodys but one HTML which is halfway down...
<!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" xml:lang="en" lang="en"> --> <head> <title>Available now</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> </head> <body> <!-- Your content can be inserted here --> <hr width=725 color="#764E71" size="3"> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> <!-- } .style1 {font-family: Tahoma} .style3 { font-size: 14px; color: #764E71; font-weight: bold; } .style4 { font-family: Tahoma; font-size: 14px; color: #764E71; font-weight: bold; } --> </style> </head>
Apply style to part of page
oooopsy,
Ok, done that. Still looks the same........
No, you haven't removed what we said
Apply style to part of page
Are you guys looking at the right page?
I have uploaded a test page with the same code as the proper one so I can play about with it.
I am sure I mentioned this ....
http://www.genetic-gems.com/gallery/test.php
Apply style to part of page
Yep that's the page I am looking at at least.
The code still looks all very odd, you have multiple doctypes, html elements, body elements and the like.
I assume it's being dynamically generated?
Take a look at the rendered source...
Apply style to part of page
Seems to be the generator is adding in a load of extra code
Apply style to part of page
try it now guys, I have removed the doctypes from the included files...
Apply style to part of page
Closer, but it's still repeating this:
<style type="text/css">
}
.style1 {font-family: Tahoma}
.style3 {
font-size: 14px;
color: #764E71;
font-weight: bold;
}
.style4 {
font-family: Tahoma;
font-size: 14px;
color: #764E71;
font-weight: bold;
}
-->
</style>
</head>
<body>
Apply style to part of page
As far as i can see, those styles are being imported from the header and footer files. If I remove these from the files then i loose the formating on my footer etc. What to do?
I have tried removing these but the problem with the navbar still remains, which brings me back to my original question - can I hide this content from the control of the general.css?
The navbar is a DHTML menu