 Text under left table (links) |
  |
| jazz vb |
 Aug 26 2015, 06:05 PM
Post
#1
|
|
Novice  Group: Members Posts: 24 Joined: 14-April 13 Member No.: 19,010  |
Hello,
I would like to add one or two words, plain text nothing fancy, under the (classic?) left table with links. Not immediately straight under the last link, but a bit more downwards. I have tried everything I know (not a lot...) but nothing seems to work. How can I do this? Do you need any coding from my side? Thanks, Jazz |
  |
 
|
| pandy |
Aug 26 2015, 06:36 PM
Post
#2
|
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,731 Joined: 9-August 06 Member No.: 6 |
QUOTE(jazz vb @ Aug 27 2015, 01:05 AM)  Do you need any coding from my side? Yes, we do. Post the link to the page if possible. Otherwise paste the whole lot in here. All of the HTML and any CSS you may have. |
|
|
|
| jazz vb |
Aug 26 2015, 07:10 PM
Post
#3
|
|
Novice Group: Members Posts: 24 Joined: 14-April 13 Member No.: 19,010 |
the site is www.despeeller.nl
Way down under the word 'Homepage', on the 'contact' page, I would like to add the following words like this: BTW-nummer: 1234abcd |
|
|
|
| jazz vb |
Aug 27 2015, 05:01 AM
Post
#4
|
|
Novice Group: Members Posts: 24 Joined: 14-April 13 Member No.: 19,010 |
sorry, the direct link is http://www.despeeller.nl/contact.html
|
|
|
|
| CharlesEF |
Aug 27 2015, 05:17 AM
Post
#5
|
|
Programming Fanatic Group: Members Posts: 1,981 Joined: 27-April 13 From: Edinburg, Texas Member No.: 19,088 |
Just add another <tr> and <td> element below the last table row and before the table closing element </table>.
|
|
|
|
| jazz vb |
Aug 27 2015, 06:02 AM
Post
#6
|
|
Novice Group: Members Posts: 24 Joined: 14-April 13 Member No.: 19,010 |
I added a few <tr> and <td> elements. a few, to push it more downwards. it does half the trick. what happens is that when I hover over the words, they disappear and come back again when I move the mouse away.
|
|
|
|
| pandy |
Aug 27 2015, 08:32 AM
Post
#7
|
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,731 Joined: 9-August 06 Member No.: 6 |
No, don't add new rows to push it down. CharlesEF meant you should add just one new row with the text you want. To push the text down you can add top padding to that cell.
HTML <td style="padding-top: 2em"> The new line of text </td> That said, even if you use tables for layout it isn't necessary to use tables for everything and you certainly don't need a table cell for each item in the menu, but now it is as it is and it's easiest to build on what you have. |
|
|
|
| jazz vb |
Aug 27 2015, 09:56 AM
Post
#8
|
|
Novice Group: Members Posts: 24 Joined: 14-April 13 Member No.: 19,010 |
I used the different tables because of the effects I wanted to create. Perhaps not necessary anyway, but I didn't know how to do it differently.
Regarding the issue, I deleted the tables and added what you advised. It works, but also here: if you hover over the words, they disappear (or letters turn black). When I move the mouse away, the words appear again. Also the area where this happens is bigger than with the extra tables. |
|
|
|
| pandy |
Aug 27 2015, 10:48 AM
Post
#9
|
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,731 Joined: 9-August 06 Member No.: 6 |
You have to update the online webpage with the changes so we can see what's wrong.
|
|
|
|
| jazz vb |
Aug 27 2015, 03:18 PM
Post
#10
|
|
Novice Group: Members Posts: 24 Joined: 14-April 13 Member No.: 19,010 |
Dear helpers, I just updated the webpage...
|
|
|
|
| CharlesEF |
Aug 27 2015, 03:54 PM
Post
#11
|
|
Programming Fanatic Group: Members Posts: 1,981 Joined: 27-April 13 From: Edinburg, Texas Member No.: 19,088 |
The text disappears because of your CSS for the td:hover. Also, you have an error with this line of markup:
CODE <h1 class="contact">Cont(r)act?</h1> Move it to below the <body> tag. And when you added your new text to the bottom you didn't add a <tr> opening or closing tag, you only added a <td> opening and closing tag. The CSS for td:hover will effect every table cell. You need to differentiate it from the other <td> tags. Or, just remove the CSS for td:hover.This post has been edited by CharlesEF: Aug 27 2015, 04:00 PM |
|
|
|
| jazz vb |
Aug 27 2015, 04:45 PM
Post
#12
|
|
Novice Group: Members Posts: 24 Joined: 14-April 13 Member No.: 19,010 |
Removing the td:hover will make the font color go white. That's not good, because then the words are more difficult to read. And the word 'homepage' wont even be visible in its white area.
I moved all the h1's to below the bodytag. Thanks for the correction. Also, I added the <tr> and </tr>, I hope I did that the right way. Now I understand what happens with the words 'btw' and 'nummer' (btw stands for VAT in Dutch, by the way). When hovering over btw and nummer, it will make it black, like it does with the 4 links above. Does that mean I need to group the 4 links somehow and give them the hover command? Leaving the words btw and number just plane text? If so, how do I do that? If not, removing the td:hover doesnt work. |
|
|
|
| pandy |
Aug 27 2015, 05:05 PM
Post
#13
|
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,731 Joined: 9-August 06 Member No.: 6 |
You don't need to remove it. You just need to make it match the TDs you want it to match and not others. With that rule you are changing the color on hover for every TD on your site.
Change this CODE td:hover { color:black; } to CODE td.menu:hover { color:black; } Then add class="menu" to each TD you want to be affected by this rule. No other TDs will be affected. I wouldn't do it like this given a choice, but that's how to do it without changes to the HTML structure. If you want you can change the background with CSS as well. But you should definitely use real links instead of the JS redirection you have now. You don't need JavaScript at all actually. |
|
|
|
| CharlesEF |
Aug 27 2015, 05:13 PM
Post
#14
|
|
Programming Fanatic Group: Members Posts: 1,981 Joined: 27-April 13 From: Edinburg, Texas Member No.: 19,088 |
Maybe you can override the CSS by using onMouseover="this.bgColor='#FD6129';" like you have on other cells? Just pick a different color.
I think pandy's idea is better. This post has been edited by CharlesEF: Aug 27 2015, 05:15 PM |
|
|
|
| jazz vb |
Aug 28 2015, 08:40 AM
Post
#15
|
|
Novice Group: Members Posts: 24 Joined: 14-April 13 Member No.: 19,010 |
pandy's solution worked! I uploaded the new data to the website and all is working as I wished.
As I do not know a lot about html, I asked for help to get the effects I wanted. I built the site with the answers I got from several forums. A related question: is Javascript never necessary anymore? pandy and CharlesEF, many thanks for helping me out!! I am very happy with the result. Kind regards, Jazz |
|
|
|
| Darin McGrew |
Aug 28 2015, 11:27 AM
Post
#16
|
|
WDG Member Group: Root Admin Posts: 8,365 Joined: 4-August 06 From: Mountain View, CA Member No.: 3 |
QUOTE is Javascript never necessary anymore? Necessary for what?There are some effects that require JavaScript. And it's useful for pre-validating information entered into a form (but has never been a substitute for proper validation of form data on the server). |
|
|
|
| pandy |
Aug 28 2015, 02:49 PM
Post
#17
|
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,731 Joined: 9-August 06 Member No.: 6 |
It isn't necessary for simple mouseovers. But you already know that if you think about it because you change the background color with CSS.
When it comes to mouse triggered actions there is one thing that JS can do that CSS can't and that's when you want somthing to happen when something is clicked. There is no CSS equivalent to JavaScript's onclick event handler. QUOTE As I do not know a lot about html, I asked for help to get the effects I wanted. I built the site with the answers I got from several forum I understand that and it's OK to build on what you have now. I just wanted to let you know there are better ways. You'll learn as you go. |
|
|
|
| pandy |
Aug 28 2015, 02:50 PM
Post
#18
|
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,731 Joined: 9-August 06 Member No.: 6 |
Oh, you should remove the JS redirects though and use real links. That's rather important.
|
|
|
|
| jazz vb |
Aug 29 2015, 05:08 AM
Post
#19
|
|
Novice Group: Members Posts: 24 Joined: 14-April 13 Member No.: 19,010 |
QUOTE You'll learn as you go I agree, that's why I asked. QUOTE Oh, you should remove the JS redirects though and use real links. Is that the (e.g.) onclick="window.location='wie.html'" in all the td's? Does that apply to all the redirects/links? How do I change that? |
|
|
|
| pandy |
Aug 29 2015, 07:51 AM
Post
#20
|
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,731 Joined: 9-August 06 Member No.: 6 |
Yep. Remove that and use a real link instead.
http://htmlhelp.com/reference/html40/special/a.html Remove that bit altogether and use this instead. HTML <td class="menu" style="cursor:pointer;" onMouseover="this.bgColor='#FFFF6F';" onMouseout="this.bgColor='black'"><a href="wie.html">Wie</a></td> Now the link text will get the default browser styling for links. It'll probably be blue and underlined. The best would be to move the text styling from TD to A, but if you just want to remove the browser styling and use what you already have for TD this would work. CODE .tablewie a { text-decoration: none; color: inherit; background: inherit } |
|
|
|
|
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:
|
Lo-Fi Version | Time is now: 26th April 2024 - 04:29 PM |
Invision Power Board
© 2024 IPS, Inc.
Licensed to: HTMLHelp.com, LLC