Help, Sorry for the stupid quesiton |
Help, Sorry for the stupid quesiton |
KoDKingVegeta |
May 28 2007, 01:33 PM
Post
#1
|
Group: Members Posts: 7 Joined: 28-May 07 Member No.: 2,937 |
Ok So Im building a web site, and its been FOREVER since I used html, but I figured I remembered. So I get to adding links and stuff, and everytime I add one the first one dosnt become click able.
http://twistedmotorsports07.angelfire.com/ Theres my site, and here is my html, tell me what Im doing wrong. <HTML> <HEAD> <TITLE>Twisted Motor Sports</TITLE> </HEAD> <BODY> <CENTER> <DIV> <BODY BGCOLOR=99ADD0> <img src="pic/layout.jpg"> <DIV id=Layer1 style="Z-INDEX: 1; LEFT: 0px; WIDTH: 776px; POSITION: absolute; TOP: 380px;"><A HREF="http://twistedmotorsports07.angelfire.com"><img border="0" src="pic/home.gif"></A></div> <DIV id=Layer1 style="Z-INDEX: 1; LEFT: 0px; WIDTH: 1016px; POSITION: absolute; TOP: 380px;"><a href="http://twistedmotorsports07.angelfire.com/rides.html"><img border="0" src="pic/rides.gif"></a></div> <DIV id=Layer1 style="Z-INDEX: 1; LEFT: 0px; WIDTH: 1292px; POSITION: absolute; TOP: 380px;"><a href="http://twistedmotorsports07.angelfire.com/projects.html"><img border="0" src="pic/projects.gif"></a></div> </DIV> </center> </BODY> </HTML> |
Darin McGrew |
May 28 2007, 02:30 PM
Post
#2
|
WDG Member Group: Root Admin Posts: 8,365 Joined: 4-August 06 From: Mountain View, CA Member No.: 3 |
So I get to adding links and stuff, and everytime I add one the first one dosnt become click able. Which link isn't clickable? All four seem clickable to me (although the self-link from the home page to itself should not be clickable).http://twistedmotorsports07.angelfire.com/ I recommend that you fix the HTML errors reported by our online validator. |
KoDKingVegeta |
May 28 2007, 02:49 PM
Post
#3
|
Group: Members Posts: 7 Joined: 28-May 07 Member No.: 2,937 |
The first and second link are not clickable, and when i add the 4th and 5th one (pics and video button) then the first 4 dont become clickable. Also that HTML error fixer isnt any good to me, because Im using angelfire, and thats there stuff. What Im working with is what I showed you.
This post has been edited by KoDKingVegeta: May 28 2007, 02:57 PM |
pandy |
May 28 2007, 03:05 PM
Post
#4
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
Hmm, not sure what's supposed to be a link and what isn't, everything seems to be duplicated. Anyway, everything is also overlapping. Resize your browser window and see how the links move around. That kind of positioning scheme is fragile as an eggshell. Frankly, I'd start with rethinking that.
|
KoDKingVegeta |
May 28 2007, 04:32 PM
Post
#5
|
Group: Members Posts: 7 Joined: 28-May 07 Member No.: 2,937 |
They are only there (the background ones) for me to line them up. Once there lined up, then they will go away. But all the buttons are "Home, Rides, Projects, Pictures, Videos" Those are my links.
|
pandy |
May 28 2007, 05:24 PM
Post
#6
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
OK. The links work for me too. But they don't line up. They are all over the place.
|
iloveu328 |
May 28 2007, 09:33 PM
Post
#7
|
Group: Members Posts: 3 Joined: 28-May 07 Member No.: 2,941 |
I think it might be cause you did em' in capitals so in sted of doing this:
<HTML> DO THIS <html> </html> and so on. I may be wrong about it but give it a try. Much love Jesska Aussie chick |
Darin McGrew |
May 29 2007, 11:14 AM
Post
#8
|
WDG Member Group: Root Admin Posts: 8,365 Joined: 4-August 06 From: Mountain View, CA Member No.: 3 |
QUOTE I may be wrong about it but give it a try. You're wrong. See the FAQ entry Should I use lower case or upper case for tags? |
KoDKingVegeta |
May 30 2007, 12:17 AM
Post
#9
|
Group: Members Posts: 7 Joined: 28-May 07 Member No.: 2,937 |
Ok Heres my problem once again, I have all my link buttons on my site, but NONE but the last one is clickable. I have the buttons at the top of the page so u can find them. The all needs moved down 380px that will line it up.
http://twistedmotorsports07.angelfire.com/ And once agan, heres my html <html> <head> <title>Twisted Motor Sports</title> <body> <center> <BODY BGCOLOR=99ADD0> <img src="pic/layout.jpg"> <DIV id=Layer1 style="Z-INDEX: 1; LEFT: 0px; WIDTH: 776px; POSITION: absolute; TOP: 0px;"><a href="URL"><img border="0" src="pic/home.gif"></a></div> <DIV id=Layer1 style="Z-INDEX: 1; LEFT: 0px; WIDTH: 1012px; POSITION: absolute; TOP: 0px;"><a href="URL"><img border="0" src="pic/rides.gif"></a></div> <DIV id=Layer1 style="Z-INDEX: 1; LEFT: 0px; WIDTH: 1292px; POSITION: absolute; TOP: 0px;"><a href="URL"><img border="0" src="pic/projects.gif"></a></div> <DIV id=Layer1 style="Z-INDEX: 1; LEFT: 0px; WIDTH: 1600px; POSITION: absolute; TOP: 0px;"><a href="URL"><img border="0" src="pic/picture.gif"></a></div> <DIV id=Layer1 style="Z-INDEX: 1; LEFT: 0px; WIDTH: 1886px; POSITION: absolute; TOP: 0px;"><a href="URL"><img border="0" src="pic/video.gif"></a></div> <center> <DIV id=Layer4 style="Z-INDEX: 1; LEFT: 0px; WIDTH: 890px; POSITION: absolute; TOP: 440px;"> NEWS AND UPDATE INFORMATION HERE <br> HELLO & WELCOME TO TWISTED MOTOR <br> SPORTS. YOUR ONE STOP FOR CAR <br> MODS. AND UPGRADED INFORMATION. </div> </center </body> </html> |
Frederiek |
May 30 2007, 04:31 AM
Post
#10
|
Programming Fanatic Group: Members Posts: 5,146 Joined: 23-August 06 From: Europe Member No.: 9 |
Despite the fact that you use Angelfire, the HTML validator points out that you have several DIV's with the same ID, which need to be unique.
Your problem lies precisely in the fact that you use another DIV for each link. By the positioning of each DIV, they overlap each other; as they all start at left: 0px and have different widths. By putting a border around the div's (eg. border: solid 1px red;), you'll understand better what's happening. That's not the way to go. Put your links in just the one DIV, position that and give some left/right padding to the images. You're code could look like this: CODE <div id="navigation" style="position: absolute; top: 195px; left: 140px; width: 800px;"> (Adjust the TOP position to take Angelfire's added code in account.)<a href="URL"><img class="nav" src="pic/home.gif"></a> <a href="URL"><img class="nav" src="pic/rides.gif"></a> <a href="URL"><img class="nav" src="pic/projects.gif"></a> <a href="URL"><img class="nav" src="pic/picture.gif"></a> <a href="URL"><img class="nav" src="pic/video.gif"></a> </div> with this in the HEAD section of the page: CODE <style type="text/css"> .nav { border: none; padding: 0 40px; /* top/bottom 0, left/right 40px (adapt to your linking) */ height: 18px; } </style> Or go see at Listutorial. |
KoDKingVegeta |
May 30 2007, 09:09 PM
Post
#11
|
Group: Members Posts: 7 Joined: 28-May 07 Member No.: 2,937 |
THANK YOU!!!! So much, thats what Iv been needing.
|
Frederiek |
May 31 2007, 03:18 AM
Post
#12
|
Programming Fanatic Group: Members Posts: 5,146 Joined: 23-August 06 From: Europe Member No.: 9 |
You're welcome.
But now, your absolute positioning of everything pushes your content too much to the right. And you have structural errors, such as two BODY tags, multiple style declarations in the HEAD (which can be wrapped in only one), lack of the # sign before color or quotes around attribute values. Also, group all CSS styling between the <hed></head> tags at the top of the page, including those you used as inline styling. I suggest you read the following: HTML: HTML Document structure CSS: Embedding a Style Sheet CSS Structure and Rules and this FAQ: Where can I learn about CSS? and find many articles and tutorials on CSS at: Web Design References: CSS. |
KoDKingVegeta |
May 31 2007, 08:55 PM
Post
#13
|
Group: Members Posts: 7 Joined: 28-May 07 Member No.: 2,937 |
Ok, one more thing, I forget the code all together for repeat background.
http://twistedmotorsports07.angelfire.com/rides.html See what I mean, at the bottom the lines stop. I forget the code to make it repeat as long as there's stuff. |
Darin McGrew |
May 31 2007, 10:58 PM
Post
#14
|
WDG Member Group: Root Admin Posts: 8,365 Joined: 4-August 06 From: Mountain View, CA Member No.: 3 |
Please see the FAQ entry How do I have a non-tiling (non-repeating) background image?
Then just reverse the advice. |
KoDKingVegeta |
Jun 1 2007, 05:11 AM
Post
#15
|
Group: Members Posts: 7 Joined: 28-May 07 Member No.: 2,937 |
it sounds so easy to do, but everytime i enter this html
BODY { background: white url(candybar.gif); background-repeat: repeat-x } it dosnt do anything, not a thing, all it does is show up on my page. |
Frederiek |
Jun 1 2007, 07:14 AM
Post
#16
|
Programming Fanatic Group: Members Posts: 5,146 Joined: 23-August 06 From: Europe Member No.: 9 |
I don't see you have entered that anywhere in your page. Nor does that image exist on the server.
And maybe, because you already show the background shorthand, use that for the repeat too: body { background: white url(candybar.gif) top left repeat-x; } See http://www.w3.org/TR/CSS21/colors.html#propdef-background (or start at the top of that page). |
Darin McGrew |
Jun 1 2007, 10:31 AM
Post
#17
|
WDG Member Group: Root Admin Posts: 8,365 Joined: 4-August 06 From: Mountain View, CA Member No.: 3 |
it sounds so easy to do, but everytime i enter this html That isn't HTML. It's CSS.BODY { background: white url(candybar.gif); background-repeat: repeat-x } it dosnt do anything, not a thing, all it does is show up on my page. Please see the FAQ entry Where can I learn about CSS? |
Frederiek |
Jun 2 2007, 04:39 AM
Post
#18
|
Programming Fanatic Group: Members Posts: 5,146 Joined: 23-August 06 From: Europe Member No.: 9 |
Have you read the links to which I pointed you, about the structure of an HTML document and how to embed a CSS stylesheet?
Add to that an appropriate DOCTYPE. Get rid of one of the BODY tags and close the HEAD correctly (see a complete HTML 4 document). Use just ONE stylesheet declaration in the <head></head> pairs and put all your CSS in that stylesheet (see embedding a style sheet. So, also your CSS declaration for the body, for your background image, should be moved to the CSS in the HEAD. QUOTE the black bar, is a temp for my repeat background, I need it to follow down the page with the pics, and end when the pictures end. also when I move my page around, the black bar stays in the center, I need it to follow the background image also, so ppl with smaller/bigger screens will be able to look at it right. I don't quite understand what you want. As you have coded it now, it's positioned at the bottom of the viewport (the part of the page you see) and stays at the bottom when you scroll the page. It's the "fixed" declaration that does that (though it's not supported by all browsers, AFAIK). And it doesn't repeat. Using the shorthand your declaration could look like this: body { background: #99ADD0 url("pic/bg.jpg") 50% 100% fixed no-repeat; } (added the BGCOLOR you have in the BODY tag, which you should delete) You don't have a liquid layout, your content stays fixed to the right of the window, as I said before. If you resize the window, the background image (bg.jpg) does move to keep its place, but the content doesn't. At the link to Web Design References: CSS, which I gave you before, you'll find articles and tutorials on liquid design. Or pick your choice at Layoutgala. |
Lo-Fi Version | Time is now: 25th April 2024 - 05:22 AM |