HTML - Automatic Div Size
hey all, working on some simple coding that is giving me trouble.
here is what i have so far: HTML Code: <div style = 'position:absolute; width:auto; background-color:#DFD2FC;padding:10px;'> <div style = 'position:relative; background-color:#B6FCCC;'> <p>pair</p> <div style = 'position:relative; float:left; background-color:#FCE4B6; margin:5px; padding:5px;'> <p style = 'align-text:left'>1<br>2<br>moo<br>meow</p> </div> <div style = 'position:relative; float:left; background-color:#FCE4B6; margin:5px; padding:5px;'> <p style = 'align-text:left'>3<br>4<br>sdf<br>asdf<br>sdf</p> </div> </div> </div> however, it's not behaving correctly. i'd like the 'green' div to change in size according to the text within the 'yellow' divs. and then the 'purple' div should change size compared to the size of the 'green' div. i hope that's clear... any help? Similar Tutorialsi have 2 frames in my parent frame say 1.htm ie left frame and 2.htm ie right frame now this 1.htm is quite a long frame and has a scrollbar and 2.htm is a short one i dont the scroll bar beside my frame 1 but want it to be for my entire parent window ie i wont to scroll both my left and right frames together how do i do that Hi! I have a page that contains a text area. What I want it to do is to change its size according to the size of the browser window. How can I make it do that? I did it once but just can't seem to remember how I did it. Thanks All: Working to update a previously designed website. Original design uses an <img> tag to create a top banner and another <img> tag to create a side banner. In each case there are mapped coordinates on each banner as links for the subsequent pages. Basic page design is as follows: Code: <table> <tr> <td> <img usemap="Map1"> <map name="Map1"> <area> <area> <area> </map> </td> </tr> </table> <table> <tr> <td> <img name="Map2"> <map> <area> <area> <area> </map> </td> <div> ***PAGE CONTENT*** </div> <tr> <table> The challenge is that the [PAGE CONTENT] varries in length througout the site causing some pages to be much longer or shorter than others. This causes some inconsistencey in the relationship between the side banners height and the page content. In other words in some cases the banner is exceptionally longer than the page content and the reader must scroll past significant "dead-space" before being brought to the lowest mapped links in the side banner; or... ...in some cases the side banner is significantly shorter than the page content causing the banner image to appear "poorly-fit" to the page design. I considered altering the 2nd table instance in the above design so that the banner is carried in a <td> tag that is adjacent to the page content and hopefully to allow the tag carrying the image to size relative to the <td> tag carring the content.... Code: <table> <tr> <td> <img usemap="Map1"> <map name="Map1"> <area> <area> <area> </map> </td> </tr> </table> <table> <tr> <td size="100%"> <img name="Map2"> <map> <area> <area> <area> </map> </td> <td size="100%" > <table> ***PAGE CONTENT*** </table> </td> <tr> <table> The problem I've found with this is that as the content size causes the image to "flex", either readablilty or image quality or both are effected, AND the mappings become inconsistent as the image coordinates constantly change. I've considered 2 solutions and am leaning toward one, but thought I'd post this and see if there are better ideas I'm overlooking. One idea was to add additional table rows inside the [PAGE CONTENT] table presumably creating a "defalut" page size that would never be smaller than a standard for the side banner. Problem: larger page sizes are still a problem as are the changing map coordinates My other idea was to return to the original page design listed first above and again settle on a standard side banner "height"... ...any page that was significantly longer than that height would be split to 2 or more pages with a [NEXT>>] button at the bottom of the page navigating to the additional content. Problem: ...possible complications splitting content... Benefit: ...consistent page design that allows a consistent side banner with navigable links... Question for the group: Does this sound reasonable? Are there better alternatives I am overlooking? THANKS IN ADVANCE FOR ALL INPUT!! Hi, this is my first post and I'm pretty new at HTML. Ok, I have been making a script and it works fine, but there's a problem. Most websites I visit (including this one) when you make the window smaller, the stuff you covered up simply goes off screen, but in my script, when you cover it up most stuff shifts down a line and is still visible. This look very messy having things constantly shifting around! : I was wondering if there was some tag or something that causes everything to freeze in place no matter how small the window gets. -Thanks Hi there I use www.webnode.com to build & maintain the website for our children's orchestra. On my website we have a page were every kid's name, photo and age is showed. I was wondering if there was an automatic age changer system code, so I would not have to check every day if there are birthdays and having to change them manually. Something like this; Name, <age>, photo. That age would be calculated by putting in the birth date. Is that possible? Thx in advance! Martino I was wondering if it's possible to automatically copy a file to a website from another site. The reason I ask, is the company I work for wishes to show the newsletters from their partner company but doesn't want to update their website after each letter. So, I know I can create a link to their site rather easily, but I'm wondering if it's possible to actually copy the files that are stored in .pdf format. Ok so I am extremely new to coding and am setting up a small website. Everything I use right now is based off of a few excel spreadsheets and the site I'm making I want some of that info in a more public format rather than sharing a bunch of spreadsheets. One spreadsheet I have imports the html tables from another website and puts it into a google docs spreadsheet. So whenever the source code is changed on the original website it is also changed on my spreadsheet. Now, is it possible to reference a specific spreadsheet cell(s) (instead of the specific data in the cells) so that when the data is changed on the spreadsheet it is also changed on my website. The way I have it now it only shows what was on the spreadsheet at the time the code was entered. So if cell A1 said apples and then a day later cell A1 changed to bananas, my website still shows apples since that was what was originally entered even though the spreadsheet changed to bananas. I'm not sure if I'm too clear on what I'm asking...I tried. If you have a vague answer or a starting point where I should start looking that would be good too. Thanks. i have created a web page using MS front page and i folder nme midi containing 600 midi files and uploaded both at a free web hosting service no i need to know that is there any way that the names of all files in folder MIDI automatically appears on my web page i dont want to type names of files and then create there hyperlinks it may take lot of time i have to submit nearly 2000 files . Hi, i am sure you's are all familiar with photobucket, well i was wonderig if anyone knows the code to automatically highlight and copy to the clipboard information in a box when it is just simply clicked like it does with the ht code, image url, etc next to your picture on photobucket. thanks, karl Hi guys I was hoping someone could help. We have a screen in IT at work and would like to setup a simple webpage which cycles through a number of other webpages showing content. What im trying to find is a simple way to do this but also add a fade out fade in effect. Can anyone help? I'm making an HTML-based text editor for Windows PCs. The editor needs to have some special functions, and one of them is the automatic colouring of certain keywords. Here's the situation. (Apologies if little of the following is relevant, but I can't be sure.) The editor is part of a program. When the user wants to write something, the editor is created (an instance of the Windows WebBrowser) and custom HTML is loaded into it. So it's displaying a spontaneously-created HTML page. This page includes a section marked contenteditable=true, and that's where the user types. When the user is finished writing, they press a button, the current HTML in the browser is read and the text is extracted from it and saved, and the browser is destroyed. All that works fine. However, I'm having trouble building in some special functions. Namely keyword colouring. The host program allows the user to set a number of keywords, and a colour for each one. The idea is that when the user is typing in the editor, keywords will be detected and coloured. This colouring process needs to happen in realtime. As an amateur, I naively thought it would suffice to just read the HTML intermittently, scan for the keywords and add tags to each one, like this: Code: <SPAN style=text-colour:#FF00FF>thekeyword</SPAN> But there are several problems with this method. Every time the HTML is revised and reloaded into the browser, the "page" is scrolled back to the top. (As an aside, if anyone knows a method for getting and setting the caret position in an HTML page, I'd be grateful to know it too!) The second problem is that if the user types in the middle of a keyword, the new text inherits the colour. So obviously the tags method isn't going to be sophisticated enough. What I need is a smart way to detect and recolour keywords on the fly. Some form of syntax highlighting, I suppose. Does anybody know any tricks for doing this? JavaScript perhaps? Below is an example of what I want to achieve. As you can see, the caret is in the middle of a keyword. If the user pressed the spacebar, the editor would immediately look like the second image. What do you think? Is it possible? Thanks for reading, Seymour. Hello. I am quite new to this kind of page work so I am looking for some help. I am trying to have my page show listed items by letter and, with each letter, a number of results per a page. For example. I would like to add "Abacus" to to "A", but "A" has 20 items already. How would I make it so that "Abacus" pushes the list down and a second page is created? I am hoping for a script because I plan to add new items regularly. It would be tedious to manually create a new page and to sort every item down one. How does one enable automatic re-sizing of a web page based of the viewers resolution and browser? Is there a way to automatically login to a website that requires http authentication? I am especially talking about an image that has a src field that contains a protected image. In some browsers, for example, this works: Code: <img src="http://username:password@website.com/image.jpg"> But, this inclusion of the username/password isn't supported by all browsers I've tested it on, nor is it standard. Is there any way to do this in html or javascript? Thanks so much! Hello Everyone, I used to have this site where it had the power to on load redirection one site (If opened) to a certain one. For example; If I had google opened, and then i load my site on a different tab or window onl load of that page google would be changed to the site i put in that code. Now I have lost this code, I asked on another forum and they said something about putting target in my code. This did not work either. Atleast what I tried. Does anybody know this code or have a suggestion for me? -Troy I need help with a table and tr... I have 3 rows in a table. The first 2 contain the same td(s) - 4 of them. I'd like to have a 3rd row that contains 9 td elements visible. How can I accomplish that? Is it possible to make the third rows td elements independent of the first one (since it follows the layout of the first rows td lengths)? I m wondering which hmtl editors everyone here prefers. I have downloaded HTML-Kit & Page Breeze but I am not the sharpest tool & I end up getting frustrated as I need a more user friendly editor. Something for the ADHD adult I really won't be using advanced things like media for now, only basic HTML & CSS. What I am trying to accomplish is to get a website done without media or movable images. Also, someone told me that there are some editors which come with ready made commands, for e.g maybe such as creating a table by just clicking anywhere. Of course, I will have to specify other things. Are there any editors which automate a lot of your work & save time? Thanks a lot. Hi! I need help! How can I copy a html table row when updated? The table is not in my site! I know the name and where it is! I prefer not to copy data manualy because it's not updated reguraly and I've not so much time! If I can automaticaly insert it in a mysql database is perfect!!! Can someone help me?!? Thanks! For some reason whenever I have an img tag it causes an automatic line break. I was wondering if anyone else has encountered this problem. Basically i'm trying to add an small icon to the left of an active link. So the code basically looks like this.. <img src="icon.jpg"><a href="link.html">text link</a> The end result is a icon on one line and the link rests below it instead of everything being on one line. This is the first time this has ever happened and i'm wondering if this is normal? I realize this may seem like a noob question but any help would be appreciated. Thanks. |