|
HTML - My Page Scrolls And It Shouldn't! Any Ideas...?
My page scrolls and it shouldn't! Any ideas...? or can I not see the wood for the trees?
Link Similar TutorialsI have a web page that has a banner at the top. It is in a div. the main part of my page is also in a div. Using the Z-index parameters and the position parameters on each div, I have the main part of the page scroll underneath the banner. I have a link at the top of the page, <a href="#mondaymtgs">Meetings on Monday</a> Which points to a name anchor on the page. When the link is clicked, it goes to (or scrolls to) The named anchor: <a name="mondaymtgs">Meetings that are on Monday.</a> The problem is this, when it does scroll to the named anchor, It does it such that, the named anchor is at the top of the page, Underneath the banner. I suppose I could just keep moving the named anchor up a little at a time, each time when I move it up, testing the link to see if the page scrolls such that, the point I want I to scroll to appears just below the banner. I am going to have numerous links at the top of the page, pointing To various places on the page. I hate to have to do this for each link. I would rather just put the named anchor where I want it to page to, and have that line show just under the banner. Is there any way to do this? Thanks in advance. Laurence HI Im making a site at the mo and im looking to keep the menu and a picture stay in the same position constantly. So when then user moves the scoll wheel only the text are will scroll. I dont want there to be any border or scroll bars around the text, so the only visable scroll bar will be the browsers... any ideas? Hello there, My index page validates completely since I tidied it up using html tidy, but when i run it through browsershots it is still completely broken in firefox, opera, etc. basically anything other than MSIE it displays incorrectly. If anyone could shed any potential light on the situation it would be greatly appreciated. As you can no doubt tell, I'm no expert on creating web pages using html and css and if a page validates but still doesn't work I can't even begin to try and work out what is going on I did run my css through a validator and it came up with 30 or so instances of the same error, I hadn't ended a dimension value with px, i had just left the number, could this be the culprit? I have since corrected my style sheet so that it validates completely but I cannot upload from my FTP on the PC i'm currently using to see if it affects the browsershots results. I just wanted to put it out there and see what the ideas were of people who know a lot more about website building than I do. Bottom line: if i have an html page and a css page that validate 100% using the w3c standard is it guaranteed to work in all browsers, or are there quirky little things I need to be aware of when wanting my site to display correctly in less popular browsers such as safari etc.? Any feedback is greatly appreciated. :-) Sincere thanks in advance, Alex Browser screenshots - http://browsershots.org/http://www.alexhaines.co.uk/ HTML Validity results - http://validator.w3.org/check?uri=http%3A%2F%2Fwww.alexhaines.co.uk%2Findex.html&charset=%28detect+automatically%29&doctype= Inline&group=0 CSS Validity results - http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fwww.alexhaines.co.uk%2Fstyle.css&profile=css21&usermedium=all&warning=1&l ang=en My site - http://www.alexhaines.co.uk http://cedarcreekyouth.org/chat.html I'm able to scroll below the div.. How can I fix this? Can somebody show my how they would format this page? Please & Thank you! Cody I'm having some trouble with the two scrolls. How do I align them to match up to the picture? This is my code: HTML Code: <table border="0" cellpadding="0" cellspacing="0" width="700" height="700" background="http://img255.imageshack.us/img255/220/noridfg4.jpg"> <tr> <td width="36"></td> <td width="354" valign="bottom"> <div style="overflow: auto; height: 398px; width: 290px; padding: 0px; border: 1px black solid"> </div> </td> <td valign="bottom"> <div style="overflow: auto; height: 292px; width: 220px; padding: 0px; border: 1px black solid; margin-left: auto;"> Write text here </div> </td></tr><tr> <td height="80"></td> <td></td><td></td></tr></td></tr></table> Words are hyperlinked but shouldn't be. Help! If you scroll to the bottom of my sales letter you'll see that after the first add to cart button Your Satisfaction Guaranteed and the three guarantees are all hyperlinked. You'll also see are the second add to cart button the words "other related articles" are hyperlinked. Anyone know why? www.jimmysmithtraining.com/armworkout22 Thanks Jimmy Hello everyone! I've got a pretty strange problem. I have a div with overflow: hidden and it works fine in all the browsers except Safari. In Safari, if you have a Macbook, you can scroll the contain of the div using two fingers. However, there is no problem like this on the iTunes site. Here is my code: HTML Code: <div style="width: 480px; height: 320px; overflow: hidden; position: relative">
<img src="http://new.yogamen.net/uploads/games/crazy/1.png" style="float: left" />
<img src="http://new.yogamen.net/uploads/games/crazy/2.png" style="float: left" />
<img src="http://new.yogamen.net/uploads/games/crazy/3.png" style="float: left" />
<img src="http://new.yogamen.net/uploads/games/crazy/4.png" style="float: left" />
</div>
i have an html form that uses javascript to calculate the total price of gift cards. when i use a button for submit, everything is peachy. when i use an image to submit, the form races to the top and shows the top line of the page. the text is enclosed within a div tag that has a set height with auto as the overflow command. i removed the height and overflow, thinking that the enclosure was causing this. nope! same thing happened. this is the submit code: <input type="image" src="images/buttons_contact_calculate.gif" onclick="calcard(this.form)"><input type="text" name="totalprice" size="8"><br><input type="image" src="images/buttons_contact_reset.gif" name="reset" /> the javascript code is this: function calcard(form) { $totalprice = 0; if(form.card_twentyfive.checked==true){ twentyfive = (25 * form.twentyfive_no.value); } else { var twentyfive = 0; } form.totalprice.value = twentyfive + fifty + seventyfive + onehundred + twohundred + ".00"; } As indicated in the last line, there are five if statements including the twentyfive statement shown here for an example. the css is this: .text_box { position: absolute; top: 280px; left: 0px; width: 100%; z-index: 15; } .text { position: relative; left: 0px; top: 0px; width: 473px; height: 406px; overflow: auto; padding: 0px 30px 0px 503px; font-size: 13px; font-family: "arial"; font-weight: normal; line-height: 150%; letter-spacing: 0px; text-align: justify; color: #FFFFFF; z-index: 5; } any ideas about what is going on? how do I make my header not scroll with my gallery? anything above the images, my name, email, number, link to bio all that stuff page in question is www.paulodourado.com Hi guys. I'm working on a website for my shop, using html, php and mysql. At the moment I'm using frames but don't really like how it looks. have a look at www.jroche.com/shop I think it looks very cheap. Just wondering does anyone have any suggestions as to how i could improve it? I'd really appreciate any comments or code suggestions anyone could make. Ideally id like to have it all in one page, as opposed to using the frame layout im currently trying. I'm only working on it now so some links don't work. Thanks Hell everyone. This is my first post and im sure it will not be my last here on HTMLforums.com. I am looking to create a web page and host it using godaddy.com. I would like to have a forum on it but I am having complete creativity block here and i do not know what i want my website to be about. I love technology and i am currently a student at the University of Phoenix online and i am getting my associates degree in Information Systems. I also enjoy cars, sports, outdoors, travel and other things. I am 20 years old and am from New Jersey. The purpose of this site is to maintain an up to date example of my web design skills to show a potential employer. Please if you have any ideas let me know. I can be reached via e-mail at laxmetal23@verizon.net. I am also usually on AIM and my sn is UNC6183. Please let me know. Hello, I am not completely new to CSS or XHTML but I am having a problem that I have never come across before. Basically the problem is sizing with elements in the content field of my site. Here is an example: if I make an image like this Code: <img height='150' width='150' ..... > The height and width do not work properly in FF but if I change it to this: Code: <img style=" height:150px; width:150px;" ..... > Than it works. Why would it ever ignore the native height and width inside an image tag ( and other tags as well) What I am trying to do is create an environment that most anyone web developer can build quick content into my template. But if odd situations like this continue to happen it will not be user friendly at all. I assume there is some type of inheritance issue going on ( note I never use the inheritance property in my content div). Is there a way to create a div where its contents are unaffected by all the divs creating the template??? Thank you for the help Hey, I recently logged onto my old Piczo site which I used to store pictures on( The site domain being; http://www.badboypicturessss.piczo.com/?cr=1 ) . After logging in I discoverd no images show. Just a red cross upon the corner (I've tried to view on Firefox and Internet Explorer) When clicking propeties on the picture and entering into the Firefox html I am met with, This XML file does not appear to have any style information associated with it. The document tree is shown below. − <Error> <Code>AccessDenied</Code> <Message>Access Denied</Message> <RequestId>4B0C38630330B989</RequestId> − <HostId> 0hsgiTfM+6zl+X127uhukEZM6SYj0D+HCeYk113cG8ftnK0AM5 knte5VpiqDEKo4 </HostId> </Error> Am running out of ideas of how to get the images to show, I've tried numerous forums seeking the answer to how to display the images! Thanks for reading, be great if you could help! Hi all -- Working with a tight deadline (2 weeks) and need to come up with a solution. My company has a library of promotional materials that it makes available internally. Currently, we have a little ASP ordering app that lets employees create a cart of items and order these materials. (There is no money changing hands, it's all free.) As it stands, the plug on this app will need to be pulled on December 31st, and I need to find a new solution. I am not well-versed enough in ASP to be able to develop a new app in the given time frame, and I need something relatively simple that can get the job done. Ideally, we could take this app and move it elsewhere, but that doesn't look like it's going to be possible. Any and all ideas would be MUCH appreciated!!! Hi again guys, I have a new problem this time! On this page on my website: http://www.modular9.co.uk/artists.html I have it that when you rollover a link it changes from the artist's name to the collective name and back again. Obviously this causes a few problems such as the length of 'modular9' is shorter than most names so because they jump up a line when it is rolled-over the whole script freaks out and you get a mess. I was just wondering if you knew of any other better script that would keep the same dimensions of the original text or some other idea you could share? My script for this is: <a href="#" class="links" onclick="MM_openBrWindow('artists/richardcook.html','modular9','scrollbars=yes,width=457,height=600')" onMouseOver="this.innerHTML = 'modular9';" onMouseOut="this.innerHTML = 'richard cook';">richard cook</a> Highlighted red is the main rollover change. Any help/idea would be most appreciated! Thanks again Richard Hi! I have a problem here which really really annoys me. http://members.dodo.com.au/~rouslan/...ite/index.html when you look at the page it looks great with Firefox and when you look at it with Internet Explore 7 it also looks fine except the main content is not absolutely centered. In Internet Explore 7 you can see that by comparing margins, the left one is shorter than the right one. How can I fix that? p.s. I am a lot out-of-dated with HTML, because the last time I was constructing web pages 8 years ago, so you might notice in source I use a lot of tables, etc. If you can suggest I should change all the code, please do or simply paste it here as solution. Thank you! My previous post meantioned that I have made an advert using HTML in a page using a table and I'm using an IFrame to embed this into my main pages where needed. I've hit a real problem this time. The table I've made seems to set its own minimum width for cells. As a result this causes the end cell to slightly spill off the edge of my pages. I have manually changed everything I can possibly think of, and nothing seems to work. In what instance would a table do this? The table is in a form. Inside the table in each cell I have 1 line of text, followed by a input box directly underneath, followed by another input box directly underneith, followed by a text hyperlink directly underneath that. I have the html in the text file attached if you want to have a little nosy (the javascript file referenced is to periodically change the text of the second box in each cell). Any ideas would be much appreciated. I've spent far too much time on this advert than I would have liked... Regards Hey. First of all my html etc skills aren't any good. I have a basic understanding how it works etc, but thats about it :s So, I know how to use Photoshop, and the basics of dreamweaver. And this is what i have made so far: http://wasnicht.urli.net/ I have 2 versions, that one, and one which isn't so wide. But otherwise it's the same, except that in the uploaded version there, i dont have an iframe inside the box. So my problem here is that whenever I type something in the middle, that exceeds its original size, it expands, thats meant to do so, but it also expands the navigation bar and the rest of the page, leaving it messy and pretty, well... I'd need some ideas how to fix this, e.g. if I made a index page, just like that, without the text box, and made an iframe, that expands downwards, inside it, put a separate .html (the box). I'm not gonna rip my ass off trying it, I'd really want some ideas how to construct it. Another problem I had with the box was that the right side image of the box (the dropshadow is 90 degrees), the shadow wouldnt go with a constant depth from the top to the bottom, so when the image repeated itself i had an ugly "error". What I did was to remove the shadow of the text box entirely. What are the common issues with websites not being properly displayed in Firefox? Reason is due to my website being displayed correctly in IE but when switching to Firefox the site suddenly breaks apart. Any ideas? Hi guys, I got a quick question. I can't for the life of me understand why the youtube, facebook and twitter images below absolutely insist on having a few pixels of space to the bottom of it's line. It makes it so the following link-text seem to be too low on the line in comparison to the image. If you see in the lower left corner of www.leveldance.com you can see what i mean. Any ideas? (I have no padding added in the css) Thanks a million in advance! HTML Code: <div class="left_col_container">
<div><img src="images/navigation/sociables_headline.png" alt="Join Our Community!"/></div>
<p style="margin-top: 5px; margin-bottom: 0px">Join the newsletter!</p>
<style type="text/css">.af-form {margin:0 !important;}</style>
<script type="text/javascript" src="http://forms.aweber.com/form/36/693624936.js"></script>
<div style="margin-top: 5px">
<a class="sociables" href="http://www.facebook.com/leveldance" target="_blank"><img src="images/sociables/faceBook-icon.png" class="no_border" alt="Find us on Facebook!"/></a><a class="sidebutton" href="http://www.facebook.com/leveldance" target="_blank"> Find us on Facebook!</a>
</div>
<div style="margin-top: 5px">
<a class="sociables" href="http://www.twitter.com/leveldance" target="_blank"><img src="images/sociables/twitter-icon.png" class="no_border" alt="Follow us on Twitter!"/></a><a class="sidebutton" href="http://www.twitter.com/leveldance" target="_blank"> Follow us on Twitter!</a>
</div>
<div style="margin-top: 5px">
<a class="sociables" href="http://www.youtube.com/user/leveldancenyc" target="_blank"><img src="images/sociables/youtube-icon.png" class="no_border" alt="See us on YouTube!"/></a><a class="sidebutton" href="http://www.twitter.com/leveldance" target="_blank"> See us on YouTube!</a>
</div><br/>
</div> <!-- left_col_container end -->
|
|||||||