|
HTML - Table Placement In Browser Window?
Im in the process of redoing my website. I originally did it in dreamweaver with a very cheesy method of just using hotspots. So Im going through and redoing it by hand in html.
Im doing the index page right now and playing around with the idea of having the whole page in one table. My problem is the table isnt starting in the top left corner where I want it. I have the border set to "0" but theres still space around the table. How do I get rid of this space? Similar TutorialsSo I have a table: HTML Code: <table width="800" height="600" border="0" align="center" cellpadding="0" cellspacing="0"> ... </table> I want to have the table be both horizontally and vertically centered in the browser window... How can I do this. I've looked at all sorts of html and css methods, but nothing has worked yet! Thanks Hey guys, I customized a table & banner to include a 768x90 advertisement, and it looks fine (tested in Firefox & IE8) in the file I created: http://www.sidelinescouting.net/index7.shtml However, when I try to transfer this header to the main pages, the banner doesn't align anymore. Here's what it looks like when I do that: http://www.sidelinescouting.net/index-bad.shtml There are 3 things I notice: 1) 768x90 is misplaced, obviously (in both browsers) 2) Navigation drop-down raises higher, too close to banner, which may be a result of #3 he 3) Image starts to repeat (Copyright disclaimer shows up twice, should just be up top) Any help is appreciated! This forum has always been good to me. I know these are pretty easy questions, but I don't know that much about html and I couldn't seam to find the answer on w3 or anywhere else. NOTE: This it mainly for html, but if you have a solution in javascript or css, that would be fine. 1. How do you place a table (single celled) at a set distance from the left side and top of the page? 2. How do place a box (with a set color, thickness etc.) anywhere on the page (the same way as the table)? I know I could use the table thickness, but I like it set to "0" because I don't like its border look. Help please, thanks. hey guys - I was trying to add a little more kick to my website today and making the text appear in little windows I guess you would say - (I know the site is not complete and links are intentionally broken) if you look on the right of the page you will notice I added 2 table cells to round off the white - now the problem I can not figure out how to bring the white area over to the rounded edges whether I need to make the cell wider or if I need to add another cell - any help is appreciated. source: Http://www.medicalpracticeexams.com/index.asp Thanks i got a problem i cant figure out. in dreamweaver when i add the behavior "open new browser window" to a link that is not external....but like a small pop up page.....when the user clicks on the link, the window opens, but the main window resets....meaning if the link was at the bottom of the page and the user scrolled down to get there....they then have to rescroll on the page to get back to the bottom. how can i get the new window to open without changing the view of the main page. many thanks! Hi: I would like to maximize a browser window after a page is loaded: I believe the command would be something like: <body onload="window.maximize" > Would someone care to correct or adjust or revamp the above statement please ? Thanks Mel Smith (still wandering about in the html wilderness) Suppose a user types the url of a website in their browser, so that the script http://url/index.htm is displayed in the browser. In other words, the user is not opening the page via a link or whatever, they are just typing in your url. In that situation, what (if anything) can you put in that script itself that gives the user's browser window a name that can be referred to later. The reasons why I want to do this are complicated, but in a nutshell this first window will become the parent window of other windows that open up later via links within the page, and script within those windows will have to refer to it by a name. Alternatively, is there some standard name that your browser window automatically recieves when you open up a website, like "parent" or something, that allows you to refer to it? How can I make the browser window that my site is in automatically have specific height/width dimensions? Making toolbar and scrollbar go away would also be nice. My website pops up a browser window that cannot be resized. Occassionally though, the window's content exceeds its size. Is it possible to implement a scrollbar/scrollpane inside the window using just html? Cheers, James Hello, hopefully you can help me. I have the following code, which opens a new internet browser window: <form> <p align="center"><b></b> <select id="setit" style="color: #0000FF" size="1" name="test"> <option value="">Please Select</option> <option value="http://www.nu.nl">nu</option> <option value="http://www.telegraaf.nl">telegraaf</option> <option value="http://www.google.com">Google</option></select> <input type="button" value="Go" onclick="window.open(setit.options[setit.selectedIndex].value)"> </p></form> What do I need to change so the onclick opens the link in the same internet browser window instead of opening a new one? Many thanks, Ralfie How can I get a browser window to open maximized regardless of screen size, screen res, or browser type/version? Thanks... This is for a flash site but I think it needs to be coded in the html page. My Flash swf size is approximately 1000x700. If the browser size is smaller than this the site needs to scale down but if it is larger I don't want it to scale. Just like this http://www.milesaldridge.com/. I've tried publishing the Flash settings at ScaleDefault(Show All) which scales it but I need to stop the scaling upwards at 1000x700. I'd have thought that I could say in the html if (width<1024){scale;} and if(height<700){scale;}. But it's not working. Should it all be done in the html and if so how? Hello; I am a graphic designer that codes pages quick and dirty entirely with tables. The one I am currently working on needs to be centered in all browser windows at all sizes. I understand that this shouldn't be hard, however everything that I have tried so far hasn't worked. My thoughts are that since it is built entirely in tables (with a java search tool) that I need to make a centered container and place the entire page inside of it. I have tried a few codes I've pulled from other forums with no luck temporary url (and I know the code is dirty) www.showcasepublishing.com/myoutandabout Thanks in advance Hello, I want to open a html page in a same browser window with fullscreen mode. I tried following code: window.open("hello.html","_self","fullscreen,scrollbars") However if I use _self, I did not get page in fullscreen mode. Any help is really appreciated. Regards, John Howdy! Is there a way to force a new browser window to automatically maximize itself? I have a few links from my home page to some of my other pages that I have included the target="_blank" code to in order to get these pages to open in a new browser window when someone clicks on the link. Here's an example: <a href="nextpage.html/" target="_blank">My next page</a> Is there a way to get this new browser window to open maximized? Thanks for your help on this. JohanM Similar to how most pop-up windows are a fixed size, I was curious as to how I could fix the size of a browsing window (particularly the width) of a page. Vertical scrolling isn't as important, but I would like my index page as well as the pages within the Iframe in the index page to remain a certain width so viewers would only have to scroll vertically to view the entire content of the html document. I have tried "stealing" the coding used in pop-up windows, trying it in both the head and body of the code but to no avail. I have searched for countless hours on the 'net looking for a tutorial that gives the code for this and have had zero luck. (I know it must be possible.) Any and all help/input is greatly appreciated! Thanks so much in advance, Dereck I am new to HTML coding. I am trying to create a form, which, automatically submits the form contents and finally automatically close the browser window. But I am not able to get the self form submissions and self window closing. The code that I have written is found below. Kindly advice on how to get it working. Thanks in advance. <html> <body> </form> <p><b>This form submits an HTTP POST request to url '/forms_example/post'</b></p> <form name="form1" form method="POST" action="http://localhost/forms_example/post"> <table> <tr> </tr><tr><td>Name</td><td><input type="Text" name="name" VALUE="roger"></td></tr> <tr><td>Address</td><td><input type="Text" name="address" VALUE="smith"></td></tr> <tr><td>Phone</td><td><input type="Text" name="phone" VALUE="25714988"></td></tr> <tr><td>E-Mail</td><td><input type="Text" name="email" VALUE="roger.smithatgmail.com"></td></tr> <tr><td><input type="Submit" VALUE="submit" > </td></tr> </table> </form> </script> function GO(){ setTimeout("subForm()",0) } function subForm(){ document.form1.submit() } t = null; function closeMe(){ t = setTimeout("self.close()",2000); } </script> </body onload="GO()";"closeMe()"> </html> Hey guys, I recently setup a basic "intranet" for my family, since we have a number of computers, and it would be easy to leave messages for each other, attach files, etc. It may not be an intranet per se, but it acts as one. I have setup "Appserv" on a computer that is always on, which is a package that installs everything you need to turn a normal PC into a server, and I have installed "Wordpress" into a folder in "root/wordpress/". What I want to do is create a file, index.* in the root directory and force each computer's browser to head to that file. Now what I want is for it to open as a normal webpage (since we all use Google as our homepage, that would be preferrable) with a small thin bar at the top/bottom, which says "Go to Intranet Home" or "Close This Window". Now I have tried a variety of ways to do this, including frames, but the problem is that the URL will not change. If i point the file to 192.168.1.6/index.php, it will show that as the address even if you type something into google and go to links etc (as it is the frame's URL, not the browser's). What I need is for the browser to open into a page that acts normal, except has a hovering bar that can send the family members to the wordpress home page. I was thinking that maybe CSS could do it but I'm not even sure if this is possible at all. If the URL dosen't change, its not possible for anybody to bookmark sites as it will always bookmark the same address. Please leave feedback even if the idea is not possible, any help is greatly appreciated. Thanks again, Curtis I have a terrible problem how to make this page resize whatever the resolution of the browser. I've already did liquid layout via percent but the height doesn't do it. They want the content to be scalable in whatever browser dimensions they want. Kindly help me. Thanks. Here is the html: Code: <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Porter House New York</title>
<link rel="shortcut icon" href="images/favicon.ico" />
<link rel="stylesheet" href="css/main.css" />
<script src="js/jquery.js"></script>
<script src="js/drop-down-menu.js"></script>
<!--[if IE]>
<script src="js/CreateHTML5Elements.js"></script>
<![endif]-->
<!--[if IE 6]>
<script src="js/unitpngfix.js"></script>
<![endif]-->
</head>
<body>
<header> <a href="index.html"><img src="images/logo_porter_house_new_york.png" alt="Porter House New York" class="logo" title="Porter House New York" /></a> </header>
<!-- end header -->
<nav>
<ul>
<li><a href="#" class="about" title="about">about</a>
<ul>
<li><a href="#" title="The Restaurant">The Restaurant</a></li>
<li><a href="#" title="The Chef">The Chef</a></li>
<li><a href="#" title="The Owners">The Owners</a></li>
</ul>
</li>
<li><a href="#" class="menus" title="menus">menus</a></li>
<li><a href="#" class="press" title="press">press</a></li>
<li><a href="#" class="photos" title="photos">photos</a></li>
<li><a href="#" class="private" title="private dining">private dining</a></li>
<li><a href="#" class="gift" title="gift certificates">gift certificates</a></li>
<li><a href="#" class="contact" title="contact">contact</a></li>
<li><a href="#" class="watch" title="contact">contact</a></li>
<li><a href="#" class="reserve" title="contact">contact</a></li>
</ul>
</nav>
<!-- end nav -->
<div id="content">
<div id="contentTop"> </div>
<!-- end contentTop -->
<div id="side"></div>
<!-- end side -->
<div id="main">
</div>
<!-- end main -->
<div id="contentBottom"> </div>
<!-- end contentBottom -->
</div>
<!-- end content -->
<footer>
<p>© Copyright 2007. Porter House New York. Powered by 2B-Unique.com</p>
</footer>
<!-- end footer -->
</body>
</html>
Here is the CSS: Code: /* ---------------------------------------- */
/* CSS RESETS */
/* ---------------------------------------- */
@import url('reset.css');
body {
background: #fff url(../images/bg.jpg) repeat-x center 0;
background-size: 100% 100%;
-o-background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-khtml-background-size: 100% 100%;
-moz-background-size: 100% 100%;
}
/* ---------------------------------------- */
/* HEADER */
/* ---------------------------------------- */
header {
position: relative;
margin: 1% auto 0;
height: 20%;
width: 98%;
background: url(../images/header.png) no-repeat 0 0;
*background: url(../images/header_ie.gif) no-repeat 0 0;
background-size: 100% 100%;
-o-background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-khtml-background-size: 100% 100%;
-moz-background-size: 100% 100%;
}
header img.logo {
margin: 3% 0 2% 3%;
height: 50%;
width: 25%;
}
/* ---------------------------------------- */
/* NAV */
/* ---------------------------------------- */
nav {
position: relative;
margin: 0 auto;
height: 28px;
width: 98%;
background: url(../images/nav.png) no-repeat 0 0;
*background: url(../images/nav_ie.gif) no-repeat 0 0;
background-size: 100% 100%;
-o-background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-khtml-background-size: 100% 100%;
-moz-background-size: 100% 100%;
}
nav ul {
margin-left: 1.1%;
position: relative;
}
nav li {
position: relative;
float: left;
}
nav a {
display: block;
text-indent: -9999px;
height: 25px;
background: url(../images/nav_sprites.png) no-repeat 0 0;
}
nav a.about {
background-position: 0 0;
width: 73px;
}
nav a.about:hover {
background-position: 0 -25px;
}
nav a.menus {
background-position: -73px 0;
width: 85px;
}
nav a.menus:hover {
background-position: -73px -25px;
}
nav a.press {
background-position: -158px 0;
width: 83px;
}
nav a.press:hover {
background-position: -158px -25px;
}
nav a.photos {
background-position: -241px 0;
width: 98px;
}
nav a.photos:hover {
background-position: -241px -25px;
}
nav a.private {
background-position: -339px 0;
width: 145px;
}
nav a.private:hover {
background-position: -339px -25px;
}
nav a.gift {
background-position: -484px 0;
width: 166px;
}
nav a.gift:hover {
background-position: -484px -25px;
}
nav a.contact {
background-position: -650px 0;
width: 84px;
}
nav a.contact:hover {
background-position: -650px -25px;
}
nav a.watch {
background-position: -741px 0;
width: 252px;
}
nav a.watch:hover {
background-position: -741px -25px;
}
nav a.reserve {
background-position: -993px 0;
width: 121px;
}
nav a.reserve:hover {
background-position: -993px -25px;
}
nav ul ul {
position: absolute;
left: -10px;
top: 25px;
z-index: 900;
padding: 3px 0;
background-color: #ffffeb;
}
nav ul ul li {
float: none;
width: 143px;
}
nav ul ul a {
margin: 0 3px;
padding-left: 10px;
height: 16px;
width: 127px;
background: none;
color: #71462d;
font: normal 12px Tahoma;
text-indent: 0;
text-decoration: none;
text-transform: uppercase;
}
nav ul ul a:hover {
background: url(../images/submenu_hover.jpg) no-repeat 0 0;
color: #fff;
}
/* ---------------------------------------- */
/* CONTENT */
/* ---------------------------------------- */
#content {
position: relative;
margin: 0 auto;
overflow: hidden;
height: 304px;
width: 98%;
background: url(../images/content.png) repeat-y 0 0;
*background: url(../images/content_ie.gif) repeat-y 0 0;
background-size: 100% 100%;
-o-background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-khtml-background-size: 100% 100%;
-moz-background-size: 100% 100%;
}
#contentTop {
position: absolute;
top: 0;
left: 1.05%;
z-index: 100;
background: url(../images/content_top.png) repeat-x 0 0;
*background: none;
height: 2%;
width: 97.85%;
}
#contentBottom {
position: absolute;
bottom: 0;
left: 1.05%;
z-index: 100;
background: url(../images/content_bottom.png) repeat-x 0 0;
*background: none;
height: 2%;
width: 97.75%;
}
#side {
position: relative;
float: left;
display: inline;
margin-left: 1.1%;
height: 304px;
width: 19.62%;
}
#main {
position: relative;
float: right;
display: inline;
margin-right: 1.1%;
min-height: 276px;
width: 76.07%;
padding: 28px 0 0 12px;
}
/* ---------------------------------------- */
/* FOOTER */
/* ---------------------------------------- */
footer {
position: relative;
margin: 0 auto;
width: 98%;
background: url(../images/footer.png) no-repeat 0 0;
*background: url(../images/footer_ie.gif) no-repeat 0 0;
background-size: 100% 100%;
-o-background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-khtml-background-size: 100% 100%;
-moz-background-size: 100% 100%;
}
footer p {
margin: 20px 0 0 11px;
display: inline-block;
text-indent: -9999px;
height: 50%;
width: 40%;
background: url(../images/copyright.png) no-repeat 0 0;
background-size: 100% 100%;
-o-background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-khtml-background-size: 100% 100%;
-moz-background-size: 100% 100%;
}
|
|||||||