Jump to content

Resizing

cpugeek

By cpugeek
in HTML/XHTML

 Share

Recommended Posts

cpugeek Member

cpugeek

Posted
Posted (edited)

I have a problem I am making a website for a new customer and they requested a table that's able to auto resize so no matter what resolution the screen is on it's the same here is the code of the doc.

<!-- Copyright © Pwi.inc --><head><title>PWI inc. Tel.(316)-942-2811 Fax (316)-942-6209</title><style type="text/css">a:link {color: #000000}a:visited {color: #000000}a:hover {color: #000000}a:active {color: #000000}</style><style type="text/css"><!--body {position: relative; background: #FFFFFF; margin: 0; padding: 0;}div#links {position: relative: 50px; left: 0; width: 100px; height: 100px; font: 10px bold 1em sans-serif; z-index: 10;}div#links a {display: block; text-align: center; font: bold 1em sans-serif;    padding: 5px 5px; margin: 0 0 1px; border-width: 0;    text-decoration: none; color: #FFC; background:#0000ff;   border-right: 5px;}div#links a:hover {color: #411; background: #AAA;   border-right: 0px double white;}div#links a img {height: 0; width: 0; border-width: 0;}div#links a:hover img {position: absolute; top:5px; left: 5px; height: 100px; width: 100px;}div#content {position: absolute; top: 100px; left: 25px; right: 25px;   color: #BAA; background: #22232F;    font: 13px Verdana, sans-serif; padding: 10px;    border: solid 5px #444;}div#content p {margin: 0 1em 1em;}div#content h3 {margin-bottom: 0.25em;}h1 {margin: -9px -9px 0.5em; padding: 15px 0 5px; text-align: right; background: #333; color: #667; letter-spacing: 0.5em; text-transform: lowercase; font: bold 25px sans-serif; height: 28px; vertical-align: middle; white-space: nowrap;}dt {font-weight: bold;}dd {margin-bottom: 0.66em;}div#content a:link {color: white;}div#content a:visited {color: #BBC;}div#content a:link:hover {color: #FF0;}div#content a:visited:hover {color: #CC0;}code, pre {color: #EDC; font: 110% monospace;}--></style></head><body bgcolor="FFFFFF"><table border="1" align="left" bordercolor="#000000" width="10%"><font color="#000000" size="4" face="system"><br><br><br><br><br><br><br><td><div id="links"><a href="D:\main.htm" title="Cost Effective Large and Small Production Quantities Available!" TARGET="main">HOME<img src="D:\pwi new logo 100 WB.jpg"></a><a href="D:\OME Aircraft Lighting System.html" title="Electronic Ballists &Lighting Systems" TARGET="main">CCFL LIGHTING SYSTEMS<img src="D:\lights 129x101.jpg"></a><a href="http://www.pwi-e.com/cath.html" title="Stock Cold CathodeFluorescent Lamps" TARGET="main">STOCK LAMPS<img src="D:\lights2 166x100.jpg"></a><a href="http://www.pwi-e.com/cath.html" title="Custom DesignFluorescent LampsCustom SizesShapes and Colors " TARGET="main">CUSTOM LAMP Manufacturing<img src="D:\GLASS 133x100.JPG"></a><a href="http://www.pwi-e.com/coil.html" title="CustomCoil WindingTransformersInductorsResistors " TARGET="main">COIL WINDING<img src="D:\coil2 160x103.jpg"></a><a href="http://www.pwi-e.com/coil.html" title="Stock Magnetometers.Custom DesignMagnetometerCoils & Cores" TARGET="main">Magnetometers<img src="D:\Magnetomer 113x100.jpg"></a><a href="http://www.pwi-e.com/eng.html" title="Development &Consulting Services" TARGET="main">ENGINEERING<img src="D:\ENG1 140x105.JPG"></a><a href="D:\contract manufacturing.htm" title="Cost EffectiveDesign & Manufacturing" TARGET="main">CONTRACT Manufacturing<img src="D:\Automation1 135x101.jpg"></a><a href="http://www.pwi-e.com" title="New Products & Whats In Development" TARGET="main">NEW PRODUCTS<img src="D:\manu2 153x101.jpg"></a><a href="D:\about us 2.htm" title="Serving YouSince 1963" TARGET="main">ABOUT US<img src="D:\HOME 260x134.jpg"></a><div> <marquee bgcolor="#000000" scrollamount="2" direction="up" loop="true"> <center><img src="D:\pwi new logo 50 WB.jpg"></a><br><br><font color="#FFFFFF" size="1" face="system">Univolt © <font color= yellow>ELECTRONIC BALLIST<font color="#FFFFFF"<br><br><br>Input 10V to 120V  AC/DC With One Unit<br><br><img src="D:\pwi new logo 50 WB.jpg"></a><font color= yellow><br>Input<br>TEN to 120V AC/DC<font color="#FFFFFF"<br>ELECTRONIC BALLIST<font color= yellow ><br>ONE UNIT<br>THE<font color="#FFFFFF"><br>UNIVOLT ©</font> </center> </marquee></div></table></body>

I have done everything to fix this but its not totally working-Any help appreciated

Edited by Skemcin
Link to comment
Share on other sites
Skemcin Devoted Member

Skemcin

Posted
Posted

Well, I think I understand what you are after. So, I take a stab:If you want your presentation to be a fixed size, no matter what the monitor screen resolution is set to, then you simply need to change this:

<table border="1" align="left" bordercolor="#000000" width="10%">

to

<table border="1" align="left" bordercolor="#000000" width="300">

By defining to be 10% it iwll change because 10% 800 is less than 10% of 1024.

Link to comment
Share on other sites
holmedwa04 Invested Member

holmedwa04

Posted
Posted
I have a problem I am making a website for a new customer and they requested a table that's able to auto resize so no matter what resolution the screen is on it's the same here is the code of the doc.
<!-- Copyright © Pwi.inc --><head><title>PWI inc. Tel.(316)-942-2811 Fax (316)-942-6209</title><style type="text/css">a:link {color: #000000}a:visited {color: #000000}a:hover {color: #000000}a:active {color: #000000}</style><style type="text/css"><!--body {position: relative; background: #FFFFFF; margin: 0; padding: 0;}div#links {position: relative: 50px; left: 0; width: 100px; height: 100px; font: 10px bold 1em sans-serif; z-index: 10;}div#links a {display: block; text-align: center; font: bold 1em sans-serif;    padding: 5px 5px; margin: 0 0 1px; border-width: 0;    text-decoration: none; color: #FFC; background:#0000ff;   border-right: 5px;}div#links a:hover {color: #411; background: #AAA;   border-right: 0px double white;}div#links a img {height: 0; width: 0; border-width: 0;}div#links a:hover img {position: absolute; top:5px; left: 5px; height: 100px; width: 100px;}div#content {position: absolute; top: 100px; left: 25px; right: 25px;   color: #BAA; background: #22232F;    font: 13px Verdana, sans-serif; padding: 10px;    border: solid 5px #444;}div#content p {margin: 0 1em 1em;}div#content h3 {margin-bottom: 0.25em;}h1 {margin: -9px -9px 0.5em; padding: 15px 0 5px; text-align: right; background: #333; color: #667; letter-spacing: 0.5em; text-transform: lowercase; font: bold 25px sans-serif; height: 28px; vertical-align: middle; white-space: nowrap;}dt {font-weight: bold;}dd {margin-bottom: 0.66em;}div#content a:link {color: white;}div#content a:visited {color: #BBC;}div#content a:link:hover {color: #FF0;}div#content a:visited:hover {color: #CC0;}code, pre {color: #EDC; font: 110% monospace;}--></style></head><body bgcolor="FFFFFF"><table border="1" align="left" bordercolor="#000000" width="10%"><font color="#000000" size="4" face="system"><br><br><br><br><br><br><br><td><div id="links"><a href="D:\main.htm" title="Cost Effective Large and Small Production Quantities Available!" TARGET="main">HOME<img src="D:\pwi new logo 100 WB.jpg"></a><a href="D:\OME Aircraft Lighting System.html" title="Electronic Ballists &Lighting Systems" TARGET="main">CCFL LIGHTING SYSTEMS<img src="D:\lights 129x101.jpg"></a><a href="http://www.pwi-e.com/cath.html" title="Stock Cold CathodeFluorescent Lamps" TARGET="main">STOCK LAMPS<img src="D:\lights2 166x100.jpg"></a><a href="http://www.pwi-e.com/cath.html" title="Custom DesignFluorescent LampsCustom SizesShapes and Colors " TARGET="main">CUSTOM LAMP Manufacturing<img src="D:\GLASS 133x100.JPG"></a><a href="http://www.pwi-e.com/coil.html" title="CustomCoil WindingTransformersInductorsResistors " TARGET="main">COIL WINDING<img src="D:\coil2 160x103.jpg"></a><a href="http://www.pwi-e.com/coil.html" title="Stock Magnetometers.Custom DesignMagnetometerCoils & Cores" TARGET="main">Magnetometers<img src="D:\Magnetomer 113x100.jpg"></a><a href="http://www.pwi-e.com/eng.html" title="Development &Consulting Services" TARGET="main">ENGINEERING<img src="D:\ENG1 140x105.JPG"></a><a href="D:\contract manufacturing.htm" title="Cost EffectiveDesign & Manufacturing" TARGET="main">CONTRACT Manufacturing<img src="D:\Automation1 135x101.jpg"></a><a href="http://www.pwi-e.com" title="New Products & Whats In Development" TARGET="main">NEW PRODUCTS<img src="D:\manu2 153x101.jpg"></a><a href="D:\about us 2.htm" title="Serving YouSince 1963" TARGET="main">ABOUT US<img src="D:\HOME 260x134.jpg"></a><div> <marquee bgcolor="#000000" scrollamount="2" direction="up" loop="true"> <center><img src="D:\pwi new logo 50 WB.jpg"></a><br><br><font color="#FFFFFF" size="1" face="system">Univolt © <font color= yellow>ELECTRONIC BALLIST<font color="#FFFFFF"<br><br><br>Input 10V to 120V  AC/DC With One Unit<br><br><img src="D:\pwi new logo 50 WB.jpg"></a><font color= yellow><br>Input<br>TEN to 120V AC/DC<font color="#FFFFFF"<br>ELECTRONIC BALLIST<font color= yellow ><br>ONE UNIT<br>THE<font color="#FFFFFF"><br>UNIVOLT ©</font> </center> </marquee></div></table></body>

I have done everything to fix this but its not totally working-Any help appreciated

It is worth noteing though that if you do make a table using percentages instead of pixels that although it will resize to whatever you want pictures will cause you problems, the pictures will stay the same size when you resize the screen. And eventually depending on the size of the pictures you will get a scroll bar, so just something worth thinking about when making the page!
Link to comment
Share on other sites
RMN Newbie

RMN

Posted
Posted
I have a problem I am making a website for a new customer and they requested a table that's able to auto resize so no matter what resolution the screen is on it's the same
When you say "auto resize" do you mean always keep the same (fixed) size, or do you mean always occupy the same relative area (percentage) of the browser window?RMN~~~
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing
×
×
  • Create New...