|
HTML - <td> Changes Its Height Despite Given Parameters
I made a preliminary layout for a website:
index4-table-bad.html The problem is that it only works as intended in Opera browser. In IE and in FireFox a problem occurs: the <td id="td-menu2"> expands and shows the red background (I gave the red background intentionally to better see the problem). The "Article", "Menu1", and "News" will be dynamically generated (in php) and can have different heights. There is no option to predict which one will be the tallest. Please tell how should I correct the page so that: - <td id="td-menu"> should not expand and stay 35px heigh and the article should go just below it with 5px spacing (as it now works only in Opera) - as it is now, all areas should end at the bottom at the same level (I mean: "MENU1", "ARTICLE", "NEWS" should end at the same level/line at bottom). What would be the best way to improve this layout to correct abovementioned bug? I haven't been coding html for over 10 years so I am not sure how I should approach to this bug nowadays. Is it better to add Javascript or trasform this layout into divs instead of the table. But even with divs it will perhaps need Javascript to keep areas ends at bottom at same level. Or is there any better way than Javascript? I am working with current browser versions: Opera 9.64, IE 8, FireFox 3.0.10. Regards, Mark Similar TutorialsHi! I was wondering whether someone could enlighten me (or do it for me), as to how I use URL Parameters. I don't understand javascript, or much html for that matter. I have a page, 'http://goldenlightsoft.org'. I want to set it up so if someone types in 'http://goldenlightsoft.org/index.htm?page=downloads.htm', they would see the normal page, except that the iFrame in the middle ('I1'), would be pointing to downloads.htm of the site, not the normal home.html. I would prefer this system to work without compatibility issues with other browsers, and also I am not sure of the hosts capabilities. I know html and javascript work fine. Can someone help me with this? Thanks, dawmail333 I have been working on this thing forever!! I am in desperate need of help!! I currently am running an HTA file called h1.hta and I want to be able to open another HTA called h2.hta that will take in parameters and close the current HTA. I am using this snippet of code to open the new h2.hta(parameters) within my current h1.hta : nextpage = h2.hta?trial=2&condition=1 //vbscript set WshShell = CreateObject("WScript.Shell") WshShell.Run(nextpage) When I run this, I get a "File not Found" error. I believe it's because the file in the system is entitled h2.hta and when i send it with the parameters, it does not recognize. My question is how do I go to another hta file with parameters??? Hi Everyone, I'm slightly confused by this one. But i'm sure theres a hack out there to fix it. Basically, in firefox and konqueror, running on kubuntu, the top navigation bar at http://www.tendervendors.com/dev/payroll.html displays correctly, and when you hover over it, it fills the li with a semi-opaque background. This is correct. Its done, by filling the a element, with a background-color and then applying opaque: 0.5; The a element also has padding, which makes it fill out to the size of the li element, so the a element fills its portion of the ul, and looks like the li has the affect applied to it. However, in opera, the right and left padding is correct, but the height padding doesn't work. Does anyone know of a bug in opera that would be causing this problem, and possibly a code fix for it? TIA Matthew Millar Hi, How can I explicitly add parameters to a form, besides the input that the user has inserted ? I have tried something as: action="www.nnn123.com?myPrameter=1" but it doesn't work... thanks I'm working on a site with an image gallery which directly links to images. I'd like to modify this so that, when those images are small, they are no longer displayed off-center and on a white background. At some point in the past I think I remember seeing a site that somehow passed display parameters to the browser along with the image link. Is this possible, or am I imagining things? Thanks for any info. (If this turns out to be impossible, I'll be rebuilding the gallery a bit, and any hints on an easy way to do this would also be apreciated.) I am writing an "external link exit page" where anytime a user clicks on an external link in my site, it navigates to a page exit.html that says something to the effect of: "Please note that you are leaving our website, and therefore we are not responsible for the content of the website you are about to visit." I was thinking of making the destination URL be a parameter, so for example a section of links on my website might look something like this: <h3>Other Sites You Might Find Useful</h3> <a href="exit.html?url=http://www.google.com">Google</a><br /> <a href="exit.html?url=http://www.yahoo.com">Yahoo!</a><br /> <a href="exit.html?url=http://www.weather.com">weather.com</a><br /> So in exit.html I have a parameter called url that needs to be decoded and placed in my HTML source. After I display the warning message I want to give the user the option to either go back or continue to the externall url. <h3>You are now leaving our website. Please be advised that we are not responsible for the content of the website you are about to visit. </h3> <h4>Are you sure you want to continue?</h4> <a href="[URL parameter]">Yes! Continue to [URL parameter]</a><br /> <a href="javascript:history.go(-1)">No! Cancel and go back</a><br /> How do I do this? I'm having an issue with the size of my main.swf. When I use the swfobject.embedSWF code, leaving it as 100% 100% covers the entire browser window obscuring my background image. In order to view the image I have entered '1000' and '725' which are the dimensions of my main.swf. However, this left aligns the swf and the height appears to not work, I am left with a black box that extends from the bottom of my main.swf to the bottom of the browser window. What do I need to adjust in order to keep my main.swf top aligned, centered horizontally and my background image visible. Also, if anyone happens to know how I could have the background image scale to fit horizontally/vertically without repeating, that would be great. Thanks. HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Website Title</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="swfobject/swfobject.js"></script>
<script type="text/javascript" src="swfaddress/swfaddress.js"></script>
<script type="text/javascript">
swfobject.embedSWF('main.swf', 'website', '1000', '100%', '9.0.45', 'swfobject/expressinstall.swf', {}, {bgcolor: '#CCCCCC', menu: 'false'}, {id: 'website'});
</script>
<style type="text/css">
/* hide from ie on mac \*/
html, body, #website {
height: 100%;
overflow: hidden;
}
/* end hide */
body {
background-image: url(images/background.png);
background-repeat: no-repeat;
background-position: 50% 0%;
margin: 0;
padding: 0;
font: 86% Arial, sans-serif;
}
</style>
</head>
<body>
<div id="website">
<p>In order to view this page you need Flash Player 9+ support!</p>
<p>
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
</p>
</div>
</body>
</html>
Guys, I have the following code which was generated by a Firefox add-on: Code: <SearchForm>http://legendas.tv/index.php?opcao=buscarlegenda</SearchForm>
<os:Url type="text/html" method="POST" template="http://legendas.tv/index.php?opcao=buscarlegenda">
<os:Param name="txtLegenda" value="{searchTerms}"/>
<os:Param name="selTipo" value="1"/>
<os:Param name="int_idioma" value="99"/>
</os:Url>
Is it possible to get all these parameters together in a single URL line? Something like: Code: http://legendas.tv/index.php?opcao=buscarlegenda&txtLegenda={searchTerms}&selTipo=1&int_idioma=99
I don't know. This was just a banal example to picture my intention. So, is it possible? If so, please, what would that URL look like? Thanks a lot, guys. brunces Is it possible (&if so how) to pass a search parameter when linking through an iframe. Page A always wants to load a suppliers catalogue in an iframe with the search field filled - same fill every time (so if it is possible there are no complications). Unfilled the address is suppliersite.com/search.asp The form on the suppliersite search page search page only has one field & search button Thanks sub I have a div and within that my navigation menu. My menu is made up of ul with their styles removed and floated left to make the list horizontal. I'm trying to make the background colour of my div white, but it doesn't have any height so it's not showing up. This html code works in Google Chrome (100% height), but not in IE (25% height). How can i fix it so IE shows it correct? Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8"/>
<title>
Welcome
</title>
<style type="text/css">
html
{
overflow: hidden;
}
body
{
margin: 0px;
}
object
{
width: 100%;
height: 100%;
}
.center
{
text-align: center;
margin-top: 20%;
}
</style>
</head>
<body>
<div class="holder">
<object type="application/x-shockwave-flash" data="preloader.swf">
<param name="movie" value="preloader.swf"/>
<div class="center">
To use this site you must have Javascript enabled and be using the current version of Adobe Flash Player.
<br/>
<br/>
<a href="http://get.adobe.com/flashplayer/">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash Player" style="border: 0px;"/>
</a>
</div>
</object>
</div>
</body>
</html>
I have two columns in my page layout. I would like them to be the same height without declaring an exact height for both coloumns. Is there anyway to do this. I have attched a simple example of what I mean. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
.column1{
border: solid 1px black;
width: 400px;
margin: 20px;
padding: 5px;
margin-left: 100px;
background-color: aqua;
height: auto;
}
.column2{
border: solid 1px black;
float: right;
width:400px;
padding: 5px;
margin: 20px;
margin-right: 100px;
background-color: #92c847;
}
.holder{
border: 1px solid black;
overflow: hidden;
}
</style>
</head>
<body>
<div class="holder">
<div class="column2">
<h4> Column 2</h4>
<p>text text text text text text text text text text text text text text text text
text text text text text text text text text text text text
text text text text text text text text text text text text
</p>
<p>text text text text text text text text text text text text text text text text
text text text text text text text text text text text text
text text text text text text text text text text text text
</p>
</div>
<div class="column1">
<h4> Column 1</h4>
<p>This should be the same height as column2</p>
</div>
</div>
</body>
</html>
Thanks Calyspo okay so i have page, i want it to build itself to encompass at the minimum 100% of the browsers height dynamically i have seen a few methods of doing this via css and html and i have done it in the past without issue but now it wont do it anymore and im not sure why so the site is www.wiffleague.com/main.php (you may have to maximize browser to see what i mean) i want the footer section (at the bottom, the table with the copyright info in it) to always be bottom justified no matter the height of the rest of the page. currently what occurs is that if the page does not have enough content to fill the vertical height then it simply appends the footer section at the bottom of that and then a blank space under the footer. Hi, I have a table and I need a background in one cell to extend down to the bottom of the cell (which is also the bottom of the page) from a certain point (below the content of that cell). I figured I would just use a div to do that... like this <html> <head> <style type="text/css"> .divbg { background:url(tree.jpg); height: 100%; } </style> </head> <body> <table> <tr> <td> <p>Content</p> <div class="divbg"> </div> </td> <td> <p>Content takes up a lot of space here and continues down the page a bit, so that is why the background in the cell to the left has to continue down the page.</p> </td> </tr> </table> </body> </html> Unfortunately, that didn't do anything. It just left me with a strip of my background image right under the content. So... I discovered online that you have to set the parent to 100% as well. I made the td <td height="100%"> and with no luck, I made the table <table height="100">. This just did really weird stuff and I realized what the problem was. This was making the div 100% height of the window itself. All I want is for the div to go from top to bottom (not including the content at the top of the cell). Is this even possible? Let me know if my explanation is unclear... Thanks! P.S. In the real site I am using XHTML 1.0 Transitional if that makes a difference. I might be able to change that though, if I need to. It was just the default that Dreamweaver put there. I'm not sure what the rest of the site would look like if I changed that now. I'm having problems with making a div height to 100%. What i mean is that the div height stretches to how long the contents of the page is. If you check out my sample here, the green div on the left only stretch to the windows "visible" viewing area, then if you lower, the height doesn't go any lower than that. any idea? HTML Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
</head>
<style type="text/css">
body{
margin:0px;
height: 100%;
min-height: 100%;
max-height: 100%;
}
#left{
position: absolute;
z-index: 1;
left: 0px;
top: 0px;
background-color: red;
width: 100px;
height: 100%;
}
</style>
<body onload="fixheight()" onresize="clearTimeout(t);t=setTimeout('fixheight()',10);">
<div id="left">
<div style="width: 100px;background-color: green;height: 100%"></div>
</div>
<div align="center">
<p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p><p>sfsdf</p></div>
</body>
</html>
Ok I have been racking my brain on this one for two weeks and I still cannot find an answer to this, which I know I will kick myself when I find out. I have this sidebar in a table and the sidebar spans 4 Rows the problem is that each cell does not condense down to the smallest size possible and I don't know what to do to fix it. The page in question is at http://wentworthatdraper.com/test/ The page renders great in Chrome but not FF and IE I'll put all the code I think is relevant here. <tr> <td width="77" height="160" class="sidebar" > <div class="title"> Main </div> <div class="subtitle3"> <ul> <li> <a href="index.html">Home</a> <a href="contact.html">Contact Us</a> <a href="calendar.html">Calendar</a> <a href="news.html">News</a> </li> </ul> </div> </td> <td width="721" colspan="2" rowspan="4" class="content"> <p> Edited </p></td> </tr> <tr> <td height="272" class="sidebar" > <div class="title"> Our Community </div> <div class="subtitle3"> <ul> <li> <a href="index.html">Living With Us</a> <a href="contact.html">Meet The Staff</a> <a href="calendar.html">Testimonials</a> <a href="news.html">Photo Gallery</a> <a href="index.html">Apartment Deals</a> <a href="contact.html">Dining Services</a> <a href="calendar.html">Amenities</a> <a href="news.html">Location</a> </li> </ul> </div> </td> </tr> <tr> <td height="20px" class="sidebar"> <div class="title"> Gallery </div> <div align="center"> <img src="../test/Images/photos/happy-home.jpg" width="131" height="86" /> </div> </td> </tr> <tr> <td height="100%" class="sidebar"> <div class="title"> Our Location </div> <div class="sidewriting"> 11631 S 700 E <br /> Draper, UT 8402 <p> <a href="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=11631+S+700+E++Draper,+UT+8402&sll=37.0625,-95.677068&sspn=42.360237,93.076172&ie=UTF8&hq=&hnear=11631+S+700+E,+Draper,+Salt+Lak e,+Utah+84020&ll=40.540906,-111.870153&spn=0.009963,0.022724&z=16&iwloc=A" target="_blank">Get Directions </a></p> </div> </td> </tr> .sidebar { width:175px; background:url(../images/sidebar.jpg) repeat-y; vertical-align:top; margin:auto; } .title { background:url(../images/title.jpg) left no-repeat ; height:30px; padding:10px 0px 0 15px; color:#FFF; font-weight:bold; vertical-align:top; } Thank you so much for looking at this Hey guys, me and my friend are going to begin working on a forum but we've run into one small problem with CSS floats and 100% height (yes, I know it doesn't work). Could you look at this page in Firefox, please? http://automata.firephoenixnet.com/atom.ic/ As you can see, everything works fine except for the posts (which are supposed to look-forum like) and the sidebar, which doesn't stretch all the way down to the footer bar (because of the post weirdness). Is there any way to fix this? Thanks guys! Hi, I am looking to get a table along the side of my page to stretch from top to bottom. I tried <table height="100%"> and .high {height:100%} ... <table class="high"> but it didn't work it only shows until the end of the table's content. Is there a way to do this? Thanks Resolved and links no longer available so text removed. |
|||||||