HTML - Layer Moves On The X Access...help Please
Hi All...
I'm building a website in Dreamweaver 8. I have one layer in the site that contains a form field for collecting email addresses. The layer is placed on top of an image. When I horizontally resize my browser window the layer moves. When I resize the browser vertically it stays in place. I've tried switching the layer properties from relative to absolute and back again but it doesn't make a difference. Could someone please have a look at the page and see if they have any suggestions? The link is http://www.sweetdivinemusic.com/storycollective This is the last piece I need to fix before taking the site live. Thanks a ton folks! Robert Similar Tutorialswhen i click on a link on my "test page" the div with my links in it moves up...but when i click back to the "home" page it moves back down take a look at the attached file to see what i'm talking about...is there any way of fixing this...it does this on both FF and IE 8. can someone help me with this...if it's something that i simply have to deal with then that's fine...just thought that maybe something was wrong and could be fixed. I've got a page of results, and at the bottom it has page numbers and a link for next page etc all head in a div. Sometimes it is display correctly with 20px margin-top, but other times, it has no margin-top, but will move down to its correct position when you try click on it. Anyone had this sort of thing before? Thanks I created a layout in photoshop that was in 1024x768 res and then I put it into Dreamweaver and got the layout aligned but when I insert text it stays where I want it but then when I change my res the text moves. I used "Draw Ap Div" in Dreamweaver to create the text over the image sliced layout. Is there any way of keeping it where I want it at every res? Hi there, I am currently making an iPhone/Touch website, and would like to know how I can make it so the top banner stays at the top, while the main body of the site scrolls up and down below it. Can you help? Josh I am attempting to put an amazon link on my web site. I have found the position I want but when I minimize the screen the link moves over to the other text. If you want to see exaxtly what I talking about go to: http://www.mullady.com/mortgages.html Here is the exact code I am using the BOLD is the problem area <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" > <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>MuLLady.com - Mortgages</title> <meta http-equiv="Content-Language" content="English" /> <meta http-equiv="Content-Type" content="text/html; charset=us-ascii" /> <meta content="MuLLady Financial Solutions" name="description" /> <meta content="mullady, mortgage, finance, credit, real-estate, realestate, asset protection, insurance, credit repair" name="keywords" /> <meta content="index,follow" name="Robots" /> <meta content="sNews 1.5" name="Generator" /> <link media="screen" type="text/css" rel="stylesheet" href="style.css" /> <link title="RSS 2.0" type="application/rss+xml" rel="alternate" href="rss/" /> <style type="text/css" > .post { font-size: 16px; } </style> <style type="text/css"> iframe { position:absolute; top:400px; left:200px; } </style> </head> <body> <div class="content"> <div id="top"> <div id="icons"><a title="Home page" href="index.html"><img alt="Home" src="images/home.gif" /></a> <a title="Contact us" href="contact.html"><img alt="Contact" src="images/contact.gif" /></a> <a title="Sitemap" href="sitemap.html"><img alt="Sitemap" src="images/sitemap.gif" /></a> </div> <h1>MuLLady.com</h1> <h2>Financial Solutions</h2></div><!-- end of the Top part --></div> <div id="lowercontent"> <div id="lower_wrap"> <div id="lower_pic"><a title="Trident Financial 244 information request" href="TF244apply.html"></a> <div id="lower_slogan"> <div class="post"> <iframe src="http://rcm.amazon.com/e/cm?t=mu05-20&o=1&p=8&l=as1&asins=0316044695&fc1=000000&IS2=1<1=_blank&m=amazon&lc1=0000FF&bc1=000000&bg1=FFF FFF&f=ifr" style="width:120px;height:240px;" scrolling="no" marginwidth="20" marginheight="0" frameborder="0"></iframe> <h4 class="title">Mortgage information </h4> <p>We have access to the premier companies in the mortgage industry...and that is saying something.</p> <hr /><img alt="" src="images/mortgagelogos.jpg" /><br /> <hr /> <p>We have thrived in this ever-changing industry, gaining the strength and respect necessary to provide our clients with the best possible mortgage experience. Perhaps it's because we know where our priorities are.</p> <br /> <p>We help make home ownership a reality. We help buyer, borrowers and loan officers build a life they can be proud of. We know what's important.</p> <br /> <p>We have access to the premier lenders in the mortgage industry. Our mission is to provide our clients--both the consumer and our partners--with the best possible financing options available in today's mortgage lending environment.</p> <br /> <p>We were born out of a solid business concept to offer a better way for the mortgage professional to serve the home buyer on a local level, while having the power of a national mortgage bank behind them. By providing our branches with the benefit of a nationwide network, they are able to offer better personal service, more competitive rates, and faster closing times than their competitors. Our concept is to have all of our offices working together to bring the best possible service and products to home owners. We have offices all over the country, each one locally staffed and operated. Our Loan Officers live in your neighborhood. They drive on your streets. They're your neighbors--and, they root for the home team.</p> <br /> <p>Our goal is to provide the home buyer with the most experienced loan experts, the lowest rates possible, unbeatable customer service, and a worry-free experience, whether they are buying a new home, refinancing an existing loan, or getting a home-equity loan. Our system not only benefits our various national branches, it benefits borrowers all over the country. By giving our branches the autonomy to make decisions on the local level, the power to lend within a multi-billion dollar mortgage banking institution, and the technology and tools to do it quickly, efficiently, and accurately, we have given them the opportunity to truly excel in customer service.</p> <br /> <p>We have experienced record growth, and an ever-expanding branch network. We have partnered with many mortgage professionals, and we are continuing to grow. Our partners have the size to command respect in the market place, funding billions of dollars in mortgages each year. This respect is carried to the branches, who, in turn, offer it to our customers</p> <br /> <p>There are few joys more rewarding than helping a friend into a home. Homes build neighborhoods, communities, and friendships. This is the passion and joy behind our Branch Partners. We help individuals and families across the country achieve their dream of home ownership.</p> <br /> <p><a title="Mortgage Information Request" href="244form.html">Click Here To Request Assistance</a></p></div> <div class="post"> </body> </html> In this code I'm using, on the index page is a log-in box. Once a user logs in the log-in box disappears and the container below the log-in box moves up to the log-in box spot. The reason I want to change this is that it leaves a blank space below the moved-up container. Can this code below be changed to, instead of the log-in box disappearing, it is replaced by an equal sized text box, thereby not allowing the below container(news flash) to move up? Any help will be appreciated. Thanks. Code: <!--Begin Right Column--> <div id="column-right-1"> <!--Begin Login Box--> <div id="login-box"> <!--[onload_300;block=div;when [var.show_login_box]=1;comm]--> <form action="login.php" method="post" accept-charset="UTF-8" class="middletext"> <ul> <li><label><font class="font4_13">[var.lang_user_name]:</font></label><span class="username"><input type="text" name="user_name_login" size="16" style="width:138px;" /></span></li> <li> </li> <li><label><font class="font4_13">[var.lang_password]:</font></label><span class="password"><input type="password" name="password_login" size="16" style="width:138px;" /></span></li> <li> </li> <li> <input type="submit" value="[var.lang_login_now]" class="button-form" /> </li> <li> </li> <li> <a href="login.php">[ [var.lang_password_reminder] ]</a> <b>|</b> <a href="[var.register_menu_link]">[ [var.lang_register_today] ]</a> <input type="hidden" name="submitted" value="yes" /> <input type="hidden" name="remember_me" value="remember_me" /> </li> </ul> </form> </div> <!--End Login Box--> <!--Begin News Flash--> <div class="header-narrow">Welcome</div> <div class="container-narrow"> This is for your content.Lorem ipsum adipisicing elit, sed do eiusmod ut labore et dolore magna aliqua <ul class="content-list-narrow"> <li><!--[var.newsflash;htmlconv=no;comm]--></li> </ul> </div> <div class="container-narrow-bottom"></div> <!--End News Flash--> </div> <!--End Right Column--> What could be wrong with my html or dreamweaver settings? I have code similar to following: Code: <div id="mydiv"> <span id="myspan"> <p>Some <em>text</em> here</p> <p>Some more text here</p> </span> </div> If I select the word 'text' in Design view and make it not-emphasized/Italics, the code changes to: Code: <div id="mydiv"> <p><span>Some text here</span></p> <span> <p>Some more text here</p> </span> </div> So it's decided to remove the id attribute from the span and move the span inside the paragraphs, and since there's two paragraphs, there's an extra span as well. The result is the same even if the span is outside the div. Even if the code is wrong, why is dreamweaver fixing it when I'm just trying to do something unrelated. (The em tag is not the only one that causes this to happen.) Hi I have made a Website for my Dad but am experiencing problems. I have put all the texts in a layer and when i view the website on my screen (1024 by 768) all is fine but when I look at the website on my dads PC (1280 by 1024) the words are not centered and are too far of to the side. how do to keep text aligned on different screen resolutions browser how do i anchor the layer/textbox so when the resolution increases the text stays where i want it to stay. Hi guys, All of my pages are centered in the middle of the screen except my contact_us.html page which shifts half a centimeter to the right (still in the middle of the page but it moves slightly). This page contains a form inside a table. Why does it move?? I can put code up if the answer cannot be resolved from the info provided Thanks, Raggy Does anyone know of maybe a Java script or some something that anchores the layers (makes the layers stay in the middle even if the resolution changes). Because i have a website (http://israelat60.zxq.net) and when i look at it in a resolution higher then 1024 by 768 the text is not in place. Thanks for you time and help I was wondering if someone could give me the javascript to make text change color or size or make bold when mouse moves over. Thanks for the help! hi all, is there a way to have a div layer 100% in height and 100% in width? thanks didn't get a reply in the css forum, here is the site.. http://www.pomatrock.brevard.k12.fl.us/goodnews.html the css file is attached as a word doc. if you go to any of the years..(2k5,2k6 etc) there is a div on the left side, used to cover up the dark brown with a light brown. Problem is, in Firefox it shows up way too long and adds a long extension of brown from the bottom of the page, but in IE it looks just fine. Some help would be greatly appreciated. :-D thanks. Hello, Please point me in the direction of button-layers. In other words: How do I make a whole layer act as a link so that when a user clicks anywhere within a layer (and not ONLY on the link in the center of it), the whole layer acts as a button? Thank you for your expertise! This is kind of hard to explain so I hope you stay with me. I have a site and everytime you navigate to a page everything is loaded. The same images the same background everything. So I firgured to help save the load time of pages I would make a frameset. Since the Only thing the on my site that changes is one layer with new text. Unfortunately, the frameset won't work. I use hidden layers as a drop down navigation for a few buttons when you hover over them. So if I were to use a framset the layer would then drop down but the mainframe would cover up the drop down navigation (which is a layer). I tried figuring out to get a layer to show up over all frames but I had no luck. I also messed around with z index but that still didnt work. So my question is... is it possible to get a layer to change but not the entire page? Here is the site, www.griffithband.com If you look you will see that layer17 is the only layer that changes. Is there a way to get that to be the only thing to change when going to a new page rather then the entire page? Layers 31, 30, and 29 are the drop down navigation, and the reason why I cannot use the frameset as they will not show becuase they go underneath the mainframe. I'm in no way very fluent with any coding. I only work on this site and thats it. Thanks in advance. I created the css below. It is a list that contains my navigation buttons on the left hand side of the page. The buttons work good. Now, I want to add some pictures to the left of the buttons. When I do this a space becomes apparent between the buttons. (top & bottom). I tried adding a layer but like I said it creates a space between buttons. Any help is appreciated. Thanks,. .Blockhead #navcontainer { width: 200px; } #navcontainer ul { margin-left: 0; padding-left: 0; list-style-type: none; font-family: Arial, Helvetica, sans-serif; } #navcontainer a { display: block; padding: 3px; width: 160px; background-color: #669966; border-bottom: 1px solid #eee; ; background-image: none } #navcontainer a:link { color: #FFFF00; text-decoration: none; } #navcontainer a:hover { color: #33FF99; ; background-image: none ; background-color: #669999 } #navlist a:visited { color: #CCCCCC; text-decoration: none; Here's the CSS code: HTML Code: <style type="text/css"> <!-- body { scrollbar-arrow-color: #425B5E; scrollbar-base-color: #98A5A6; scrollbar-face-color: #98A5A6; scrollbar-highlight-color: #FFFFFF; scrollbar-shadow-color: #425B5E; scrollbar-3dlight-color: #DEE7E8; scrollbar-track-color: #DEE7E8; scrollbar-darkshadow-color: #DEE7E8; } div#content { width: 600px; margin-left: auto; margin-right: auto; text-align: left; } .header {font-family: trebuchet MS; size: 11px; color: white; font-weight: none; BORDER-RIGHT: none 1px solid; BORDER-TOP: none 1px solid; BORDER-bottom: white 1px solid; BORDER-LEFT: none 1px solid; background-color: #660000;} .head2 { font-family: verdana; font-size: 11px; color: #4A4A5B; background-color: #FFFFFF; border: #4A4A5B; border-style: solid; border-left-width: 0px; border-right-width: 0px; border-top-width: 1px; border-bottom-width: 1px; text-align:center; background-repeat: no-repeat; font-weight: bold; letter-spacing: 1px; text-transform: uppercase;} .head { font-family: verdana; font-size: 14px; color: #64657E; background-color: none; border: #75AAB0; border-style: solid; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; border-bottom-width: 0px; text-align:center; background-image: url(head.gif); background-repeat: no-repeat; font-weight: bold; height: 26px; padding-top: 4px;} b { color: #6D82A1; font-size: 11px; font-weight: bold; } A:link {color:#beb8b8;text-decoration:none; cursor: default; font-weight: bold; border-bottom: 1px #C5CADC solid;} A:visited {color:#beb8b8;text-decoration:none; cursor: default; font-weight: bold; border-bottom: 1px #C5CADC solid;} A:active {color:#beb8b8;text-decoration:none; cursor: default; font-weight: bold; border-bottom: 1px #C5CADC solid;} A:hover {color:#5b1435;text-decoration:underline; cursor:default; font-weight: bold; border-bottom: 1px #000000 solid;} body {background-color: gray; background-attachment: fixed; background-repeat: repeat-y; background-position: left; font-family: arial; color: black; margin: 0px; letter-spacing: 0px; font-weight: normal; font-size: 12px; cursor: default;} td { font-family: trebuchet ms; font-size: 11px; color: black; font-weight: normal; } --> </style> And here's the text itself; HTML Code: <html> <head> <link rel="stylesheet" media="all" type="text/css" href="simple/simple.css" /> <script src="simple/click_menu.js" type="text/javascript"></script> <link rel="stylesheet" href="style.css" type="text/css"> <title>Ironman Football Academy | Don Bosco Prep</title> </head> <body onload="clickMenu('menu')"> <center><img src="mainimage.png"> <ul id="menu"> <li class="sub"><a href="#nogo1">Home</a> <ul> </ul> </li> <li class="sub"><a href="#nogo1">Information</a> <ul> </ul> </li> <li class="sub"><a href="#nogo1">Registration</a> <ul> </ul> </li> <li class="sub"><a href="#nogo1">Don Bosco Prep</a> <ul> </ul> </li> </ul> </center> </div> <div id="content" style="position: absolute; z-index: 2; margin-left:auto; margin-right:auto; top: 303px; width: 600px; height: 0px; overflow: visible"> <div class="header"> Welcome</div> We plan to change C-5 plane in such a way that the limitations and hazards involved with them might disappear or be lessened, advancing the study of aeronautics and its applications in technology. As the group researches the flaws associated with the structural mechanics, equipment, materials, and technology, we will develop a plan to inspire a more efficient plane. <a href="http://donboscoprep.org/istf/skystar/component2/task1.php"">Task 1</a> </div> </html> Why isn't the text (with the header welcome) not centered? this issue has been solved Hello all, I'm having some trouble getting html to display in my <layer> tags, for example if I use the code: HTML Code: <layer src = "myfile.html"> The file that I'm trying to display does not show, even though it is in the same local directory. Has anyone else ever tried this successfully? Thanks! |