HTML - Question About Monitor Width And Html Code
Hi, I have a few questions. I use Netscape Composer 7.2 to design my webpage (since it is free), and occasionally insert my own hand-written html code.
1. I have a 22" 16:9 wide-screen monitor. Why do websites waste all the space to the left and right of their content with either a background image or a single solid color? Many sites do this (but not google), such as: http://www.summitpropertiesgroup.com/about.php http://www.nytimes.com/ http://www.usatoday.com/ https://twitter.com/ Is it because they are all designed for small laptop monitors? Do most people have 17" desktop monitors these days? 2. What is the html code to shrink my webpage width to make my site look like these sites? Right now, my webpage is the width of whatever the monitor is. I assume I have to use one large table and set an absolute width to whatever?? 3. How do I verify that my website looks just as good on a 14" laptop monitor as it does a 25" desktop monitor without having to buy all these monitors or ask friends to use theirs? I am worried since I just hit the tab or space key on Netscape Composer when I want to indent in a certain manner, and I wonder how this looks to someone using a smaller monitor. I have 17" and 22" monitors myself so I know it looks good on those. I also put 640 x 480 pics side by side, with text typed on top of each pic. I am worried on a smaller monitor, only one pic may fit, and the text on top will be mixed up. Thanks for any help! Stephanie Similar TutorialsHey guys I wondered if you could provide any insight into the best method to ensure that a website will look wonderful regardless of monitor resolution. I'm trying to dip my hands into the wonderful world of design and need a few kick offs to get me going. Thanks, -Rich Hey guys I'm new here. I have static HTML generated code from a 3rd part website via some php code that I am given. I would like to customize this code (which is all in table format) as much as possible so that I can make it look ALOT BETTER... with CSS or maybe even some Javascript or PHP code of my own. I just don't know what is possible or maybe this is not possible... Here is an example of table html code that gets generated that I have: http://www.acne-skin.org/testtt.php Thank you for any help, Travis Hi . Here is my script HTML Code: <table width="200" border="0"> <tr> <td><span class="style2"> <input name="button" type="button" onclick="show('Hello')" value="Button 1" /> </span></td> </tr> <tr> <td><span class="style2"> <input name="button22" type="button" onclick="show('Goodbye')" value="Button 2" /> </span></td> </tr> <tr> <td><span class="style2"> <input name="button23" type="button" onclick="show('Good Morning')" value="Button 3" /> </span></td> </tr> <tr> <td><span class="style2"> <input name="button2" type="button" onclick="show('Goodnight')" value="Button 4" /> </span></td> </tr> </table> <p class="style2"> </p> <p class="style2"> <textarea name="textarea" cols="50" rows="10" readonly id="area"> </textarea> In the areas where it says, for example ="show('Goodnight')", how do I add HTML code in the brackets but as normal text? At the moment it is trying to read it as HTML code but I want it to be displayed as text. How would I accomplish this. It is probably pretty simple but I am a bit of a noob Thanks This may seem like a silly design question, I just CANNOT figure this out. this site, www.chrisdelia.com is made up of tables that are 100% table width. I want to replace the green area with an image that is 300x300 px and have the gray area go 100% across, but i just cannot seem to figure it out. inside the gray area also is an iFrame on each page, where the content goes, always. am i an idiot for overlooking the easiest thing ever? I am making a site that looks like this on a normal monitor: That is what I want it to look like on all monitors. But it looks like this on my widescreen monitor: I was wondering how I can center it on just widescreen monitors, or at least how I can make it look good and not change what it looks like on the non-widescreen monitors. I want to create a webpage that will allow a group of people to check a list of livestreams. (www.livestream.com) In the art community i'm in, there are around 20 livestreams that aren't all on the current monitor list and the owner is away. The current list is pretty fancy with some javascript and css, but i'm just looking for a list of names that go down and next to it say "Online/offline" I'm just looking for a backup for when some streams aren't listed. ex Fribox - Offline Fribox2 - Online Fribox3- Online I don't know alot of code, enough to make a simple webpage, but i'm more than willing to learn and would love some help if possible. Edit: livestream API allows me to grab status from a xml file. How do I drop this information into my webpage? I am looking to upgrade my monitor to 20" widecreen, but I am a bit concerened about web design. At the moment I have a 17" TFT at 1280x1024 and I have to be really carefull when designing to make it fit 1024x768. Can anyone suggest an easy way to design for a different resolution on a widecreen monitor? thanks dear guys: i have a javascript code which shows 10 recent post of my blog by RSS, there is a advertise of that site at the bottom of it, some friend told me to add : <div> tags to it and define width and height for it and for the height change the number until the ad disappears... also he told me to put the flow on "hidden" but i don't understand much can u help me out? here is an example: Code: <script type='text/javascript' src='http://rssReader.com/code.php?t=1&back=_fff&color=_444&box=_fff&max=10&rss=http://sokkan.ir/post/rss/' ></script> Hi guys, i put only one image in my page. but its not align of center of the screen. It aligned only horizontally. i want also vertically centered alignment. the image should align horizontally center and also vertically center align. how can it possible please send me the valuable solution or opinion. i gave one sample image. I was wondering how I could increase the width of the box. I thought it would be in the "width" field, but it did not work. COding below. <style> .box, .box * { margin:0; padding:0; } .box { overflow:hidden; } .box, .box p, box img { margin:1em 0; border:none !important; } .box .title { margin:0.5em 0; } .box .left, .box .right { padding:5%; float:left; width:46%; } .box .left { background:#efefef; } </style> <div class="box"> <div class="left"> <h2 class="title">Title &nb sp; & nbsp; <fb:share-button class="url" href="http://facebook.com/ test" /> </h2> <p>Content above image.</p> <img src="http://i.imgur.com/test.jpg" /> </div> <div class="right"> <p>Content to the right of the image here</p> <p>More text content on the right<br />This line isn't as spaced out <a href="path/to/file.html">link in content</a></p> <a href="http://www.test.com" target="_blank">Your link</a> </div> </div> I have a to make web page containing 2 columns. This is done. Now what I would like to insert in the code is something like this: The 2 columns should be full screen on any resolutions. Something like the page would adapt to the monitor resolution. The percent would be 80% for the first column 20% for the se cond one. What I don't know - is how to do that. Would a table resolve this problem? What would be the code for this? Suggestion are well appreciated. My site is showing expanded not looking nice in big monitors. Can anyone help please. I think it is a container or sidebar problems. pl see the attachment. I will appreciate your help. hello! i'm trying to get a 2000px x 3000px image to load horizontally centered on even the smallest monitor, making the visitor start in the image's middle top and scroll both horizontal & vertical. how can i do this without too much damage to my brain? thanks for the knowledge! berbes Hi all, I am a totally new to html, "yesterday I could not even spell it". I am working on a simple project where I have used a table to store page information (text and pictures), I read it somewhere it is the best way to do it. I figured out how to set the context width in the cell (<td width="20">) but how do set the width of the cell? Remember, I am not building "The Windsor Castle" just a little cuby house in the back so everything should be as simple aspossble, not necessarily the fastets and most versatile. Thanks in advance. I'm still extremely new to coding in html and I'm trying to figure out how to code in all the divides and space them out where I want to but I can't figure out what makes the menus and ad space and main body conform to the shape it is in on this code: And apparently I can't fit it all into a post but the web page is he http://www.huntingtonnews.net If anyone knows about how to space divides, menu bars, and such can you please look at that page and view source and give me a hint? Thanks... Codeguru Hello Everyone! (hoping for quick reply.. lol) I am not sure if this should go here, or in the design section. I chose here, because it is a problem in the code itself. I have introduced myself in the introductory section, if you want to know a little bit more about what I am doing this for. I made a template design in The Gimp photo editor. I sliced it up, and opened up the HTML file in the editor Kompozer. It opened up just like it should, but I wanted a liquid type layout, so I turned the cell's widths into the corresponding percentages, though Kompozer rounded them off. (Shown below) However, when I previewed the file this time, it appeared as if it skipped every other cell, leaving a blank white space in its spot. Not even in the right percentages. I think I know what I've done wrong, looking back now that I am writing this thread. Can someone please point me in the right direction? EDIT: Code posted as comment, due to lack of character room. I have found what seems to be a rather big problem in the HTML canvas When drawing circles, and I presume all shapes, the size of the circle is different based on whether one is filling it, or sketching it. If we have a circle of radius 10 and line width k, and we decide to fill it, that line width will be evenly dispersed about the perimeter of the circle such that half the line width is inside the circle, and half is outside the circle. If, however, the same circle is sketched, the line width will still be the same, but it will now be dispersed entirely on the outside of the circle, thus making it larger. If I am wrong, and this is how figures are supposed to be drawn, or if I am simply not using the right settings, please let me know =) Is there a way to set the minimum width on html frames which are inside a frameset such that when resizing the frames do not disappear completely? For example how would you do it in the following? <html> <frameset cols="50%,50%"> <frame src="left.htm" /> <frame src="right.htm" /> </frameset> </html> I have search around for possible answer(s) but I have not found a solution that works. Preferably, I am looking for a solution that works for recent versions of IE, FireFox at least. Thanks. in the past when ever I have string that is longer than the width specified in the <td>it always automatically line breaked for me. But now I am encountering an issue with the <td> stop auto line breaking, and instead just increase the width of the table to make the string fit in 1 line. if anyone know whats possibly causing this problem please reply, any thing suggestion is greatly appreciated. Thanks Hi all, I'd really appreciate some help on this one. I have a program which outputs very long strings of text to a HTML page. At the moment the text stays on one line resulting in an annoying horizontal scrollbar. How do I get the page to automatically format the text so that it all fits within a standard width, and so there's no horizontal scrollbar? Regards, Ruth |