Jump to content

Search the Community

Showing results for tags 'height'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • W3Schools
    • General
    • Suggestions
    • Critiques
  • HTML Forums
    • CSS
  • Browser Scripting
    • JavaScript
    • VBScript
  • Server Scripting
    • Web Servers
    • Version Control
    • SQL
    • ASP
    • PHP
    • .NET
    • ColdFusion
    • Java/JSP/J2EE
    • CGI
  • XML Forums
    • XML
    • Schema
    • Web Services
  • Multimedia
    • Multimedia
    • FLASH

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start





Website URL








Found 16 results

  1. I am looking for either in css a way to take data from the device used to input as an attribute or a way to combine css and javascript to do the same thing. there may be a variable in css now but it isn't a true variable as far as I have found so far in the tutorial and the info I want I have only seen accessed using javascript so wanted to try combining it with the css I already have. I am looking to basically create a title page with css at the top of a website or in my case an actual ebook. I have this most of the way done. I want it to survive multiple devices so I want a variable height and width and I found that but the height is not quite perfect yet. I am using 100vh for 100% viewport height meaning the entire screen height but what I really want is the full window height. there is a javascript function in the tutorial that gives you the window.innerheight but I don't know how to input that number into my height attribute. right now that 100vh height is making it so that the footer is just beyond the screen and I have to scroll down a little to see it. but what I want it to do is that there is no scrolling needed because it fits perfectly on the screen. here is the code as is. <html> <head> <title>Title Page Template</title> <style> .title { display: flex; position: absolute; height: 100vh; width: 100vw; flex-direction: column; align-items: center; justify-content: center; z-index: -1; } .title > div { width: 100%; margin: 10px; text-align: center; } .copy { display: flex; height: 100vh; width: 100vw; align-items: flex-end; justify-content: center; } .copy > div { width: 100%; text-align: center; } p.large { font-weight: bold; margin-top:1em; font-size: 200%; text-indent: 0em; text-align:center; } p.medium { margin-top:1em; font-weight: bold; font-size: 150%; margin-top:1.0em; text-indent: 0em; text-align:center; } p.small { font-weight: bold; margin-top:1em; font-size: 125%; text-indent: 0em; text-align:center; } </style> </head> <body> <div class="title"> <div><p class="large" id="start">Title</p></div> <div><p class="medium">The Sub-title</p></div> <div><p class="small">By <i>Author</i></p></div> </div> <div class="copy"> <div><p class="small">Publisher &#169; 2019</p></div> </div> </body> </html> and here is the javascript code I found that gets the info I want <html> <body> <p>Click the button to display this frame's height and width.</p> <button onclick="myFunction()">Try it</button> <p><strong>Note:</strong> The innerWidth and innerHeight properties are not supported in IE8 and earlier.</p> <p id="demo"></p> <script> function myFunction() { var w = window.innerWidth; var h = window.innerHeight; document.getElementById("demo").innerHTML = "Width: " + w + "<br>Height: " + h; } </script> </body> </html> is there a way to get the innerheight and innerwidth into my css to finish this title page design?
  2. Hello Guys, I'm working on a website for my aunt, due to the new privacy law, she needs to update the page with a new Button in the menu. I lost the programm which I created the old .png buttons, so I can't create the new one in the same style. I want to replace the old buttons with new ones, written in css. The only problem is the size of the buttons, they keep scaling with the writting in the button, but I want them all the same size. I attached the code of the css and html, can you help me? I know, the website is written in an old style, her former programmer did all the writting and I overtook the project a while ago. CSS.css Schwarzwaldverein Ortsgruppe Achern.html
  3. REQUEST: Please compare the results in the middle panel of the following two actions: ACTION ONE: Click on the phrase Weekly Podcasts under the heading Products in the navigation bar of the Grammar Captive mainpage. Scroll to the bottom of the page and view how the middle panel exceeds the height of the navigation bar and side panel. ACTION TWO: While on the same page with the same panel open click on the phrase Click and Listen. This will bring you to a different document in the same window. Notice that the middle panel does not exceed the height of the navigation bar and side panel. Also, note that the panel's scroll functionality is well in place. Now return to the Grammar Captive mainpage and perform the following: Find the phrase Q&A under the heading Search Grammar Captive in the navigation bar and click on it. Notice the absence of a border around the middle panel. Enter the word Frage in the search box and click on the Search button. (Do not hit the ENTER/RETURN key, else you will be blown away) Notice that middle content is now enclosed in a border and that the height of the content is nearly that of the navigation bar and side panel. (I acknowledge that there are some problems with the CSS, and I believe that I know how to fix them.) Click on the phrase The Answer ... wherever you would like and notice that the content of the middle panel fill below either of the two side panels. Click on the phrase Click and Read below the answer on watch the role of digital toilet paper unravel. It is this phenomenon that I am seeking to prevent with the introduction of scroll functionality. The Javascript that works for ACTION TWO on the Podcast hostpage refuses to work on the Grammar Captive mainpage. if (status === 'success') { var aside_height = $('aside').height(); $('#main').css('min-height', aside_height); $('#pagn').show(); } This, no matter the placement or alteration. Adding the property-value pair 'overflow-y' : 'scroll' achieves nothing. $('#main').css({'min-height':aside_height,'overflow-y':'scroll'}); Any ideas? Roddy
  4. Dear all: Below code is for the header part of a responsive page. The header, 275px high, is divided into a video on the left and an aside section on the right. The video takes 60% width, the remaining 40% is occupied by the aside section. The aside comprises from top to bottom: flags area with 15% height, bottom link with 25% height, and an h1 in between, set to auto height to take the remaining height. I set the h1 area to begin at 15% height (height of the flags section) and 28% from the bottom (height of the bottom link plus 3% padding). When I checked the height of h1 using a dashed box, I have noticed that it does not begin from 28px as it should. Would you pls. help me with: [*]making h1 auto area starts from where it should;[*]checking all the CSS styles and fix wherever necessary to accomplish a more sound and professional code that would serve in a responsive page. <!DOCTYPE html><html><head><style>@charset "UTF-8";/******************** Layout (global rules for all sizes) ******************************/body {margin: 0; padding: 0;}.home_page_header header a.bottom_link {display: block; position: absolute; background-position: 0px 0px; background-repeat: no repeat;}body {color: #575c7a; line-height: 1.5em; font-family: Arial; font-size: 14px; /* base font*/background: grey repeat-x 0px 0px;}.page {max-width: 980px; margin: 0px auto 0px auto; position: relative; background-color: #fff;}/************************ Layout Large Screen (default for older browsers) ****************//*************************Start Main Header ***********************/.home_page_header {height: 275px; margin: 0px auto;}.home_page_header header {height: 100%; background-size: 980px 275px; background-color: white;}/**********************************Video *************************************************/.mnvid {float: left; width: 60%; height: 100%; margin: 0px; vertical-align: middle;}/********************************Aside Formating***************************/.home_page_header aside {width: 40%; height: 100%; background-color: white; float: left; position:relative;}/******************Aside Language***********************************/.home_page_header aside .lang {display: block; position: absolute; left: 0; right: 0; top: 0; height: 15%; padding: 0px;}/**********************************Aside h1*****************************************/.home_page_header aside h1 {display: block; position: absolute; left: 0; right: 0; top: 15%; bottom: 28%; height: auto; padding: 5% 0 0 0; line-height: 150%; text-align: center; font-size: 2em; font-style: italic;color: #000; border: 1px dashed orange;}/********************Aside Bottom Link**********************************************/.home_page_header aside .bottom_link { position: absolute; left: 0; right: 0; bottom: 0; height: 25%;padding: 3%; font-size: 2em; font-weight: bold; background-color: grey;border-radius: 10px; /*to make rounded corner*/-moz-border-radius: 10px; /*to make rounded corner visible in Mozilla*/-webkit-border-radius: 10px;}/*to make rounded corner visible in browsers supporting webkit*/ .home_page_header aside .bottom_link p {position: absolute; /*to vertically and horizontally center the text*/ top: 50%; /*to vertically and horizontally center the text*/left: 50%; /*to vertically and horizontally center the text*/ margin-right: -50%; /*to vertically and horizontally center the text*/transform: translate(-50%, -50%); /*to vertically and horizontally center the text*/}.home_page_header aside .bottom_link p a {text-decoration: none; text-align: center;color: #FFF;padding: 20px; /*allows activating the link even when the cursor is far from the text. Not affecting total height of aside, so not counted. */}.home_page_header aside .bottom_link p a:hover {color: #FFB280;}</style></head><body><!--Start of main page container--><div class = "page"> <!--Start of main header--><div class = "home_page_header"> <header> <iframe class="mnvid" src="[url=https://www.youtube-nocookie.com/embed/Wc8tidOjhUY?rel=0]https://www.youtube-nocookie.com/embed/Wc8tidOjhUY?rel=0[/url]" frameborder="0" allowfullscreen></iframe><aside><div class="lang">flags here</div><h1>Our Unique Product <span><!--<p><br>-->Tastes Differently</span></h1><div class="bottom_link"><p><a href="#">Free Trial</a></p></div></aside></header></div></div></body></html>
  5. I have built a few web sites in the past but I always used Dreamweaver to do most of the work for me. So now I am going back and forcing myself to learn the nitty, gritty details of what is really going on. I am also taking a basic course on WWW authoring with an instructor who has years of experience. I've run into a problem that my teacher can't answer and is practically "un-Google-able." Why does <div id="middle_container"> in the following code have zero height? <!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"><head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>The Utterly Unoriginal Sample Page</title> <style type="text/css"> body { margin: 5px; background-color: white; font-family: Arial, Helvetica, sans-serif; } #main_container { width: 800px; margin: 5px; clear: both; background-color: lightgray; } #header { width: 790px; margin: 5px; background-color: red; } #middle_container { width: 770px; margin: 5px; clear: both; background-color: black; border-style: double; border-width: 10px; border-color: yellow; } #left_nav { width: 100px; margin: 0; float: left; background-color: lime; } #content { width: 670px; /*width: 671px;*/ /*Forces content div down under left_nav.*/ margin: 0; float: left; background-color: cyan; } #footer { width: 790px; margin: 5px; background-color: blue; clear: both; } </style></head><body> <div id="main_container"> <div id="header"> Header placeholder </div> <div id="middle_container"> <div id="left_nav"> Left Nav placeholder </div> <div id="content"> <p>Content placeholder</p> <p>Content placeholder</p> <p>Content placeholder</p> </div> </div> <div id="footer"> Footer placeholder </div> </div></body> I have posted this page at http://webtrain.austincc.edu/~grobertson/zero_height_div.html so you can more easily take a look at it and examine it in a DOM inspector. I have pared it down to the bare minimum to illustrate the problem. I have also used contrasting colors and given the middle_container div a double-line, yellow border to make it easier to see what is going on. I have set the margins on the left_nav and content divs to zero, so you can see that their top edges align with the vertical center of middle_container. Because middle_container has zero height, one could also say those two divs are butting right up against the top edge of middle_container, just as they should. If you look closely, the horizontal position and size of left_nav and content are still under the control of middle_container. They are shifted to the right by the 30-pixel-wide border of middle_container. Also, if I increase the width of either div then content gets shifted down below left_nav. So, middle_container seems to be doing its job in the horizontal direction but completely falls down, vertically. (I'm sure there is some kind of joke in there somewhere.) Why is the height of middle_container not expanded to fit the contents of the divs inside it, while main_container does exactly what I expect? Thanks P.S. Yes, I know I could solve the problem by giving everything a fixed height but I do not want to do that. That seems like a hack to get it to look "OK" without solving the problem and actually learning what is going on.
  6. On the following page you make recommendation that I feel is not correct. I know in my case it cost me a couple of hours. http://www.w3schools.com/html/html_images.asp Please note the following statements: " We suggest you use the style attribute. " If you are using Bootstrap this will interfere with the responsive nature of the image as the size of the screen changes. I suspect this would apply to other responsive frame works. You should either delete the recommendation or note the effect on responsive frame works.
  7. Hi there. We're working on a new website with Wordpress using a custom template, but on the front page there is extra vertical space that we cannot pin down, despite lots of searching. Here is a screenshot: http://img22.imageshack.us/img22/9013/ggat.png The area in red is the extra space The website can be currently seen at www.troyandray.com Using the browser dev tools we've narrowed it down to the class "entry-header" or possibly "Post-1...." but editing either class doesn't seem to fix the problem. Also, curiously, this extra space is absent on other pages, for example, if you click the article's title. I've compared the CSS between the two pages and cant find any significant difference. Any thoughts?
  8. I've stumbled upon yet another trouble with internet explorer where my images mysteriously becomes 1px by 1px instead of sizing according to it's container like other browsers.I googled the problem and it seems like a lot of people gets this problem when applying heigh:auto; to an image. I accually had this applied but it wasn't solved by removing it.I'll just leave an url for the page here so you can see for yourselves:http://tec.macework.se/catalog/products/components/ Any clues?
  9. I've got problem, how to automatic resize height of in . Here I'am trying to make pure css slideshow, and its works, but when I scale browser window widthchanges and height - doesn't. Why? and how to fix this? more of all I'll try to use different hack/advices and use a lot of them here, but it didnt work. When I change width manualy(in css), height changes.I found that problem may be in #slides{width: 500%;...} , but I need it! How to change height dynamic in this examples? p.s. sorry for my bad english...I hope you understand me....p.p.s. what I want Is adopt it for mobile devices. I know about @media but trying to make it without it.. Tnx for any help...
  10. So im here again, with another problem now. Look at the site http://mbdbygg.zxq.net/. The grey area in the middle is a div id called content and it is 800px height. Now i want to reduce the height to 400px, cause i dont need such wide space between the pictures and the footer as you see. The content div should end where the div class "center" ends. It has a border color to see where it ends. The problem now is that when i change the height to 400px the box only goes upand leaving a WHITE space under it.Meaning the footer does not follow up to the content div! What am i missing? I attach the css: *{ margin: 0px; padding: 0px;}body { margin-left: 0px; margin-top: 0px;}img { border: none;}#wrapper { min-width: 1347px; border: 1px solid #727272;font-family:Verdana, Arial, Helvetica, sans-serif;color:#cccccc;}#header { height: 180px;background-color:#FFFFFF;background-repeat:repeat-x;background-image:url(mbdbygg.gif);background-position:center;background-repeat:no-repeat;} #content { height: 800px;background-color:#2A2727;background-repeat:repeat-x;}.lefttext {position:relative;float:left;top:50px;left:40px;width:250px;height:400px;border: 1px solid #727272;}.righttext {position:relative;float:right;top:50px;right:40px;width:250px;height:400px;border: 1px solid #727272;}#center {position:relative;top:50px;left:297px;width:750px;height:500px;border: 1px solid #727272;}.meny {position:relative;font-family:Verdana, Arial, Helvetica, sans-serif;left:73px; top:12px;float:left;}.meny li{ display:inline; }.meny ul li a{ text-decoration: underline; color:#cccccc; font-weight: bold; }.meny ul li a:hover{ text-decoration: none; } .bilder { position:relative; float:left; left:1px; top:-360px; } .bilder img{ display: inline; border: 1px solid #7F7D7D; } .thumbnail { width:170px; height:130px; margin:5px; }#footer {background-color:#2A2727;background-repeat:repeat-x;border-top: 1px solid #727272;margin:0 auto; height: 60px; clear: both;}div#footer p {font-size:0.6em;font-family:Verdana, Arial, Helvetica, sans-serif;text-align:center;margin:0;padding:25px;}
  11. <?phprequire_once('includes/i_rsslib.php');require_once('functions/f_lib.php');?><!DOCTYPE html><html><head><title>Daily Sports Guide</title><link type="text/css" rel="stylesheet" href="style/style.css"><link type="text/css" rel="stylesheet" href="style/suckerfish.css"></head><body><div id="wrapper"><?php require_once('includes/i_header.php'); ?> <div style='margin: 5px; padding: 5px; border: 1px solid white; height: auto; clear: both; overflow: hidden;'><div style='float: left; width: 48%; height: 100%; border: 1px solid blue; overflow: hidden;'>Four score and seven years ago our fathers brought forth on this continent, a new nation, conceived in Liberty, and dedicated to the proposition that all men are created equal.Now we are engaged in a great civil war, testing whether that nation, or any nation so conceived and so dedicated, can long endure. We are met on a great battle-field of that war.We have come to dedicate a portion of that field, as a final resting place for those who here gave their lives that that nation might live. It is altogether fitting and proper that we should do this.But, in a larger sense, we can not dedicate -- we can not consecrate -- we can not hallow -- this ground. The brave men, living and dead, who struggled here, have consecrated it, far above our poor powerto add or detract. The world will little note, nor long remember what we say here, but it can never forget what they did here. It is for us the living, rather, to be dedicated here to the unfinished workwhich they who fought here have thus far so nobly advanced. It is rather for us to be here dedicated to the great task remaining before us -- that from these honored dead we take increased devotion tothat cause for which they gave the last full measure of devotion -- that we here highly resolve that these dead shall not have died in vain -- that this nation, under God, shall have anew birth of freedom -- and that government of the people, by the people, for the people, shall not perish from the earth.</div><div style='float: left; width: 48%; height: 100%; border: 1px solid blue; overflow: hidden; margin: 0px 0px 0px 5px;'>Governor Stevenson, Senator Johnson, Mr. Butler, Senator Symington, Senator Humphrey, Speaker Rayburn, Fellow Democrats, I want to express my thanks to Governor Stevenson for his generous and heart-warming introduction.It was my great honor to place his name in nomination at the 1956 Democratic Convention, and I am delighted to have his support and his counsel and his advice in the coming months ahead.With a deep sense of duty and high resolve, I accept your nomination.I accept it with a full and grateful heart--without reservation-- and with only one obligation--the obligation to devote every effort of body, mind and spirit to lead our Party back to victory and our Nation back to greatness.I am grateful, too, that you have provided me with such an eloquent statement of our Party's platform. Pledges which are made so eloquently are made to be kept. "The Rights of Man"--the civil and economicrights essential to the human dignity of all men--are indeed our goal and our first principles. This is a Platform on which I can run with enthusiasm and conviction.</div></div> </div></body></html> So I have created this skeleton example of a two column layout. While the content of each column may vary I would like the borders of each column to match each other. I thought that I might be able to put the columns in a wrapper, float them and then use the 'height: 100%' CSS property on both columns. Unfortunately, solving the problem is not that simple. Does anyone know a way to do this? I had a layout before that was alright but if I could somehow get to the solution for this one it would look that much nicer. Is what I am trying to achieve with the layout possible? I uploaded a live copy to http://dailysportsguide.com/prototype/. Thanks again and in advance for any of your most useful comments and suggestions. P.S. I already have a plan to accomplish the same goal with some jQuery however if this can be done with CSS I would much prefer that method...
  12. I have a table layout for my picture gallery live example : http://test.repsolhondanc24.co.uk/ When you minimise it or have it on a smaller screen resolution the table does not reduce in size like the other page content section does. Where am I going wrong. I want the table to be all the same size for width and heigh per square alternatively is there a better picture gallery I can use with out using a table (I'm keeping the light-box feature)
  13. Hi, I've been struggling with this for a while now. http://www.creamedia.fi/horisontal_slider/ Is there any possibility to get scrollbars working inside the content areas? I don't want a scrollbar for the body.Overflow is set to auto and for all the parent elements height: 100%; min-height: 100%; (including html and body). I appreciate all the help, thanks.
  14. Dear all, Currently I am building a website for my study/myself but start to experience some problems, maybe it's impossible to do but I would like to take a shot. Underneath the following URL my website is located.http://www.nielsschreuders.nl/webtest As you can see, this site exists out of one page only in which multiple sections "home, products, about,..." are located by scrolling through the page all sections can be seen. Though, in the product section I have implemented 6 spry collapsible panels but page 3 is getting confused when two spry's underneath each other are collapsed. What I would like to accomplish is to have page three (pagina 3 in dutch) pushed down when these spry's are collapsed but keeping the ability of navigating to the start of page 3 by the navigation-bar. If this would not be possible, I would like to know if it is possible to open one collapsible panel by which another one (if collapsed ) closes. I already searched for a suitable solution but I get the impression of this being a very hard to tackle problem.When extra information is needed, I would certainly like to post it here. Thanks in advance,Niels
  15. I've having an issue with a specific table cell that I can't seem to figure out.I set the cell with the id=top to a height of 174px with CSS, and yet it appears to be a height of 236px.Here is an image of what I'm talking about: For a closer look at the code - <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Sarasota-Tampa Express Homepage</title><link href="all.css" rel="stylesheet" type="text/css" /><script type="text/javascript">function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;}function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}}function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x;}function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}}</script></head><body id="theHeader" onload="MM_preloadImages('images/homeActive.png','images/about-usActive.png','images/route-and-scheduleActive.png','images/flight-informationActive.png','images/fareActive.png')" ><table id="headerTable" border="0" cellspacing="0" cellpadding="0"> <tr> <td id="logoBox"> <img src="images/Sarasota-Tampa-Express-Logo.png" width="205" height="75" alt="Logo" /></td> <td> <div id="rightsideHeader"> <p id="tagLine">We make things convenient for you! <span id="phoneNumber">Call Today! (941)366-6600</span></p> <div align="left" id="navigation"><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Home','','images/homeActive.png',1)"><img src="images/home.png" alt="Home" name="Home" width="82" height="33" border="0" id="Home" /></a><a href="thanks.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('AboutUs','','images/about-usActive.png',1)"><img src="images/about-us.png" alt="About Us" name="AboutUs" width="110" height="33" border="0" id="AboutUs" /></a><a href="thanks.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Route','','images/route-and-scheduleActive.png',1)"><img src="images/route-and-schedule.png" alt="Route & Schedule" name="Route" width="178" height="33" border="0" id="Route" /></a><a href="thanks.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('FlightInfo','','images/flight-informationActive.png',1)"><img src="images/flight-information.png" alt="Flight Information" name="FlightInfo" width="184" height="33" border="0" id="FlightInfo" /></a><a href="thanks.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Fare','','images/fareActive.png',1)"><img src="images/fare.png" alt="Fare" name="Fare" width="70" height="33" border="0" id="Fare" /></a></div> </div> </td> </tr></table><table id="mainTable" width="1024px" height="174px" align="center" border="0" cellspacing="0" cellpadding="0"> <tr> <td id="top"><img src="images/shuttlebus.png" width="374" height="146" alt="Introductory Homepage Image" /><div align="right" id="welcome"><p>Welcome to Sarasota - Tampa Express</p></div> </td> </tr> <tr> <td id="bottomLeft"> </td> <td id="bottomRight"> </td> </tr> </table> </body> @charset "utf-8";/*==== universal ====*/.body {font-family: Verdana, Geneva, sans-serif;}.table {margin: 0px;padding: 0px;}.td {margin: 0px;padding: 0px;}/*==== header ====*/#theHeader {background-repeat: repeat-x;background-image: url(images/header-gradient.png);margin: 0px;}#headerTable {height: 150px;width: 1024px;margin-left: auto;margin-right: auto;}/*==== leftside header ====*/#logoBox {width: 268px;padding-left: 50px;}#tagLine {font-family: Verdana, Geneva, sans-serif;font-size: 16px;font-style: italic;text-align: left;color: #FFF;width: 706px;height: 45px;margin: 0px;padding-top: 35px;}#rightsideHeader {height: 150px;width: 624px;margin-top: 0px;}#phoneNumber {padding-left: 100px;}#navigation {height: 70px;width: 706px;}img {border-top-style: none;border-right-style: none;border-bottom-style: none;border-left-style: none;text-decoration: none;}/*==== main content ====*/#mainTable {background-image: url(images/background-gradients.png);height: 618px;width: 1024px;} #bottomLeft {width: 406px;height: 440px;}#top {height: 174px;width: 1024px;}#welcome {vertical-align: middle;position: relative;font-family: Arial, Helvetica, sans-serif;font-size: 28px;font-style: normal;font-weight: bold;color: #C34306;top: -150px;width: 1024px;}#theHeader #mainTable tr #top #welcome p {padding-right: 150px;}#bottomRight {width: 618px;height: 440px;}
  16. Hi, How do I set the hight of iframe dynamically? Please suggest. Thank you.
  • Create New...