Navigation in IE help |
  |
 Jul 5 2009, 04:02 PM
Post
#1
|
|
 Senior Member  Group: Member Posts: 52 Joined: Jan 2007 Member No: 495,596  |
My site www.kaphotoonline.com works fine on my mac but when I visit the site using a PC on internet explorer, all the links are way off.
I know I did the navigation really goofy, but that was the only way that i could get it to work. I need to figure out some way to get it to work in IE. If some one could help me with a new navigation or anything, I would appreciate it. Heres my coding for the about-contact pages: CODE <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html> <head> <title>ka|photo about</title> <style type="text/css"> body { padding-left: 11em; color: purple; background-color: #000000; background-image: url("http://i631.photobucket.com/albums/uu40/kaphotoonline/about.jpg"); background-position: 50% 50%; background-repeat: no-repeat; } #navi { width: 600px; margin-left: 80px; margin-top: 228px; padding: 1px; } ul.navbar li { background: transparent; margin: 13em 0; padding: 6em; border-right: 1em solid black } ul.navbar a { text-decoration: none } a:link { color: transparent } a:visited { color: transparent } </style> </head> <body> <p><!-- Navigation --></p> <div id="navi"> <div><a href="index.html" class="nav">home</a> <a href="about.html" class="nav">about</a> <a href="gallery.html" class="nav">gallery</a> <a href="pricing.html" class="nav">pricing</a> <a href="contact.html" class="nav">contact</a></div> <p><!-- Main content --></p> <h1></h1> <p> </p> <p> </p> <p><!-- Sign and date the page, it's only polite! --></p> <address><br /> </address> <p> </p> <p> </p> <p> </p> <p> </p> </div> </body> </html>
Reason for edit: Use codeboxes for longer codes. Thanks. - Gabi :)
|
|
|
|
|
Jul 5 2009, 07:30 PM
Post
#2
|
|
|
Senior Member Group: Member Posts: 1,237 Joined: May 2008 Member No: 648,123 |
CODE ul.navbar li { This is the right idea, but you aren't using lists in your HTML, so it's unnecessary.background: transparent; margin: 13em 0; padding: 6em; border-right: 1em solid black } If you want to use a list, your navigation could look like this: CODE <ul class="navbar"> <li><a href="">Home</a></li> <li><a href="">About</a></li> <li><a href="">Gallery</a></li> <li><a href="">Pricing</a></li> <li><a href="">Contact</a></li> </ul> And to the first code, add in float:left;. You might have to play around with the positioning of the entire list, but you won't have to use a million no-break spaces. |
|
|
|
|
Jul 6 2009, 12:54 PM
Post
#3
|
|
|
Senior Member Group: Member Posts: 52 Joined: Jan 2007 Member No: 495,596 |
i cant really use a list i don't think, i need the links to be horizontal and to match up with my image
|
|
|
|
|
Jul 6 2009, 01:35 PM
Post
#4
|
|
|
Senior Member Group: Member Posts: 52 Joined: Jan 2007 Member No: 495,596 |
Really? So in Internet Explorer all the links match up with what they're supposed to?
|
|
|
|
|
Jul 6 2009, 07:18 PM
Post
#5
|
|
|
Senior Member Group: Member Posts: 1,237 Joined: May 2008 Member No: 648,123 |
QUOTE(kariiissa @ Jul 6 2009, 01:54 PM)  i cant really use a list i don't think, i need the links to be horizontal and to match up with my image That's what the float:left; property does. It lines all the lists next to each other. |
|
|
|
|
Jul 11 2009, 06:02 PM
Post
#6
|
|
|
Senior Member Group: Member Posts: 52 Joined: Jan 2007 Member No: 495,596 |
So, once I slice my layout image, where at in my style sheet would I place the table coding?
|
|
|
|
|
Jul 11 2009, 06:09 PM
Post
#7
|
|
|
Senior Member Group: Member Posts: 52 Joined: Jan 2007 Member No: 495,596 |
oh okay, I get what your saying but yet its so confusing :(
|
|
|
|
|
Jul 11 2009, 06:55 PM
Post
#8
|
|
|
Senior Member Group: Member Posts: 52 Joined: Jan 2007 Member No: 495,596 |
okay, one last question. I have the slices done and on the page: www.kaphotoonline.com/navigation.html but for some reason there is a gap above and under the navigation bar. How do I remove this, I know this is probably a dumb question, but after this hopefully I will be outta your hair!
Heres the code CODE <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html> <head> <title>ka|photo navigation</title> <style type="text/css"> body { padding-left: 11em; color: transparent; background-color: #000000; background-image: url(""); background-position: 50% 50%; background-repeat: no-repeat; } </style> </head> <body> <p><!-- Main content --></p> </body> </html> <table id="Table_01" width="893" height="668" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="5"> <img src="http://i631.photobucket.com/albums/uu40/kaphotoonline/homee/navigation/navigation_01.gif" width="893" height="233" alt=""></td> </tr> <td> <a href="index.html"> <img src="http://i631.photobucket.com/albums/uu40/kaphotoonline/homee/navigation/home.gif" width="216" height="106" border="0" alt=""></a></td> <td> <a href="about.html"> <img src="http://i631.photobucket.com/albums/uu40/kaphotoonline/homee/navigation/about.gif" width="138" height="106" border="0" alt=""></a></td> <td> <a href="gallery.html"> <img src="http://i631.photobucket.com/albums/uu40/kaphotoonline/homee/navigation/gallery.gif" width="136" height="106" border="0" alt=""></a></td> <td> <a href="pricing.html"> <img src="http://i631.photobucket.com/albums/uu40/kaphotoonline/homee/navigation/pricing.gif" width="144" height="106" border="0" alt=""></a></td> <td> <a href="contact.html"> <img src="http://i631.photobucket.com/albums/uu40/kaphotoonline/homee/navigation/contact.gif" width="259" height="106" border="0" alt=""></a></td> </tr> <td colspan="5"> <img src="http://i631.photobucket.com/albums/uu40/kaphotoonline/homee/navigation/navigation_07.gif" width="893" height="329" alt=""></td> </tr> </table> |
|
|
|
|
Jul 12 2009, 04:14 PM
Post
#9
|
|
 Mel Blanc was allergic to carrots. Group: Official Designer Posts: 6,371 Joined: Aug 2008 Member No: 676,291 |
You need to have your Table code in between your <body></body> tags. See if that's wrong with it.
|
|
|
|
|
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members: