February 15th, 2008, 10:24 AM
|
|
Contributing User
|
|
Join Date: Nov 2007
Posts: 286
Time spent in forums: 5 Days 4 h 17 m 49 sec
Warnings Level: 3
Number of bans: 1
Reputation Power: 1
|
|
|
Resize Container Div
Hi,
Upon resizing the browsers text size, in order to display larger text on the page, is it possible to also resize the containing div?
I have the following page, that displays the status of a shopping cart, upon resizing the browsers text, is it possible to also resize the width and height of the cartStatusOrange & cartStatusGreen div?
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">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<div id="container">
<div id="cartStatusOrange">
<div id="cartStatusGreen">
<div id="cornerLeft"></div>
<div id="cornerRight"></div>
<div id="cartStatusBold">Shopping Cart: <span id="cartStatus">(0 items)</span></div>
</div>
</div>
</div>
</body>
</html>
Code:
*
{
FONT-SIZE: 8pt;
FONT-FAMILY: Tahoma;
}
body
{
MARGIN: 0px;
PADDING: 0px;
BACKGROUND: url(bg.bmp) no-repeat;
}
#container
{
LEFT: 20px;
WIDTH: 730px;
HEIGHT: 453px;
POSITION: absolute;
/* BORDER: 1px solid rgb(0,0,0);*/
}
#cartStatusOrange
{
WIDTH: 211px;
HEIGHT: 39px;
/* BACKGROUND: rgb(255,217,83);*/
}
#cartStatusGreen
{
WIDTH: 211px;
HEIGHT: 36px;
/* BACKGROUND: rgb(187,210,1);*/
}
#cartStatusBold
{
TOP: 13px;
LEFT: 63px;
POSITION: relative;
COLOR: rgb(0,0,0);
FONT-WEIGHT: bold;
}
#cartStatus
{
FONT-WEIGHT: normal;
}
#cornerLeft
{
TOP: 14px;
WIDTH: 9px;
HEIGHT: 12px;
POSITION: relative;
BACKGROUND: url(cornerLeft.bmp) no-repeat;
FLOAT: left;
}
#cornerRight
{
TOP: 14px;
WIDTH: 9px;
HEIGHT: 12px;
POSITION: relative;
BACKGROUND: url(cornerRight.bmp) no-repeat;
FLOAT: right;
}
|
Codewalkers Forums Sponsor:
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Linear Mode
