/    Sign up×
Community /Pin to ProfileBookmark

Help required with DHTML positioning

Copy linkTweet thisAlerts:
Oct 02.2006

Hi Guys

I am a newbie and trying to make a basic webpage using webpage maker pro. For the menu I am trying to use Coffee Cup DHTML Menu builder. The problem that I am having is that the menu seems aligned with the rest of the body in resolutions: 800 X 600 and 1024 X 768. However the menu bar is all out of alignment with resolutions starting from 1022 X 768 and specially 1280 X 1024. ? Any help with fixing this problem will be highly appreciated – please explain in simple english my skill level is copy & paste. I have uploaded the page on [URL=http://www.ishvara.com.au/menu.html]www.ishvara.com.au/menu.html [/URL] – please view it different resolutions

Thanks
Sam

to post a comment
HTML

7 Comments(s) ↴

Copy linkTweet thisAlerts:
@brad-hmblpOct 02.2006 — OK there are serveral things to try but since I cannot get the graphics from your server you will have to try them and see.

1) find this code in your page "var MenuCentered='left';", and change "left" to "center"

if that does not work then

2) remove the <div id="container"> tag and its corresponding </div> tag and see what happens.

3) you might also want to check the numbers you have for "var StartTop=50;" and the

"var StartLeft=121;"

One of these three should help get you close to what you are looking for. if not let us know.
Copy linkTweet thisAlerts:
@smehraauthorOct 02.2006 — Hi Brad

Thanks for your reply

I tried using “var MenuCentered='center';” previously as the index of www.ishvara.com.au but when the browser window is resized it starts disappearing to the left and therefore I followed the advice given in Coffee Cup software forum for the new DHTML menu ‘http://www.coffeecup.com/forums/viewtopic.php?id=2428’ the advise is as follows “One thing to note. When you use this method, if you "center" the DHTML menu in the menu code, then you resize your browser window smaller, the menu will start to dissapear off the left of the page. If you need your menu to look centered, try something like this to keep it on the page:var MenuTextCentered='left'; // Item text position 'left', 'center' or 'right'(use left instead of center) then make sure to place the x co-ordinate so that it moves your menu where you want, for example:

var StartLeft=60; // Menu offset y coordinate

(moves menu 60 pixels from the left of your page, table or whatever div you have it in.)

I guess what I am getting at is that you can still use the x and y co-ordinates to help you "tweek" the position of your menu to get it just right, and the <div> with .css works great.” However if I follow this advise then it brings me back to the original problem that if I move the Y coordinates to align with the banner in 1280 X 1024 resolution it goes out of alignment in lower resolutions. Lastly in regards to the advice you gave to

“remove the <div id="container"> tag and its corresponding </div> tag and see what happens.” I have noooo idea how to do that

Thanks

Sam
Copy linkTweet thisAlerts:
@brad-hmblpOct 03.2006 — ok here is the scoup.

the method used to align your menu on your webpage and the method used to align all the rest of the content is different. Sometimes that the problem with using canned solutions like you have done here. Other things to try if your willing to is to put the entire page into a table with your header being the top row, menu the second and the main content the third row. Basic table layout is as follows &lt;table&gt;&lt;tr&gt;&lt;td&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt; of course you will have to remake the entire page using tables not <div> divisions inorder for this to work. Using tables give every thing in your page the same base to work from. when the page is resized the entire table is resized and thus your content stays aligned.
Copy linkTweet thisAlerts:
@EOBeavOct 03.2006 — of course you will have to remake the entire page using tables not <div> divisions inorder for this to work. Using tables give every thing in your page the same base to work from. when the page is resized the entire table is resized and thus your content stays aligned.[/QUOTE]


[B]No no no no no no no no no.[/B]

Do NOT tell somebody to mark up their page using tables. Tables should be used to display rows and columns of data, and that's it. You can accomplish a good layout using a stylesheet.

Repeat after me: "Tables for data, good. Tables for layout, bad."
Copy linkTweet thisAlerts:
@smehraauthorOct 03.2006 — Hi again Brad

As per your suggestion I have tried to include tabels. Please have a look at http://www.ishvara.com.au/tabel%20menu.html it seems to have fixed the problem of menu sliding to the left, however when viewed in lower resolution such as 1024 X 768 it appears with a horizontal and vertical bar - that looks carp! what am i doing wrong? and how can I fix that - please advise

Thanks again

Sam


To EO Beav

Can you please elaborate more on how to use stylesheet in this case

thanks

sam
Copy linkTweet thisAlerts:
@WelshsteveOct 03.2006 — [B]No no no no no no no no no.[/B]

Do NOT tell somebody to mark up their page using tables. Tables should be used to display rows and columns of data, and that's it. You can accomplish a good layout using a stylesheet.

Repeat after me: "Tables for data, good. Tables for layout, bad."[/QUOTE]

HEAR HEAR
Copy linkTweet thisAlerts:
@EOBeavOct 03.2006 — To EO Beav

Can you please elaborate more on how to use stylesheet in this case
[/QUOTE]

Honestly, I haven't even taken a look at your code. I just saw somebody encouraging somebody else to use tables for layout, and I thought I should intervene. We'll call it public service.

Generally speaking, you should be able to achieve anything in a css layout that you would in a table. That's been proven time and time again across the internet. My advice is to learn good html semantics, learn how to apply a stylesheet, and only then try to insert some dhtml.
×

Success!

Help @smehra spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.16,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...