...

View Full Version : CSS centralized content and dynamic width depending on the screen resolution



tomireil
07-09-2011, 12:10 AM
I am trying to find a solution how to have a dynamic width and at the same time centralized content depending on the screen resolution. Since I am new with CSS please give me some more suggestions as far as what I should change and what would solve my problem. The code is given below. Thank you

Code:


<!DOCTYPE HTML>
<html>
<head>
<meta name="keywords" content="...."><meta name="description" content="....">
<meta charset="utf-8">
<title>.........</title>

<style type="text/css">
<!--
body {
font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
background: #1d1d1d;
margin: 0;
padding: 0;
color: #000;
}



ul, ol, dl {
padding: 0;
margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
margin-top: 0;
padding-right: 15px;
padding-left: 15px;
}


.container {
width: 100%;
height: auto;
background: #1d1d1d;
margin: 0 auto;
}


.content {

padding: 5px 0;
}

.fltrt {
float: right;
margin-left: 2px;
}
.fltlft {
float: left;
margin-right: 2px;
}
.clearfloat {
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
}
-->
</style>
<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
<script type="text/javascript">

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-10272778-7']);
_gaq.push(['_trackPageview']);

(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();

</script>
</head>

<body>

<div class="container">
<div class="content">
<h1>
<object classid="clsid: D27CDB6E-AE6D-11cf-96B8-444553540000" width="980" height="700" id="FlashID" title="">
<param name="movie" value="20904.swf">
<param name="quality" value="high">
<param name="wmode" value="opaque">
<param name="swfversion" value="8.0.35.0">

<param name="expressinstall" value="Scripts/expressInstall.swf">

<object type="application/x-shockwave-flash" data="20904.swf" width="1280" height="740">
<!--<![endif]-->
<param name="quality" value="high">
<param name="wmode" value="opaque">
<param name="swfversion" value="8.0.35.0">
<param name="expressinstall" value="Scripts/expressInstall.swf">

<div>
<h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
<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" width="112" height="33" /></a></p>
</div>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</h1>
</div>
<!-- end .container --></div>
<script type="text/javascript">
swfobject.registerObject("FlashID");
</script>
</body>
</html>

abduraooft
07-09-2011, 08:54 AM
.container {
width: 85%; // you may adjust this
height: auto;
background: #1d1d1d;
margin: 0 auto;
} ?

tomireil
07-10-2011, 05:03 AM
Thank you :)
It works fine



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum