xhtml, css

by amir • 23 Aug 2008, 22:26 • Journals
Hello guys, i need help @ css .






<!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" xml:lang="fr" >

<head>
<title>s3 studio</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
<script type="text/javascript" src="swfobject_source.js"></script>
</head>
<div id="conteneur">
<div id="header">
</div>
<div id="bouton">
<object type="application/x-shockwave-flash" data="bouton.swf" width="620" height="40">
<param name="movie" value="bouton.swf" />
</object>
</div>
<div id="centre">
<div id="blocgauche">
<p>partie centrale</p>
<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>

<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>

<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>
<br />
</div>
<div id="blocdroit">
<p>partie centrale</p>
<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>

<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>

<p>partie avec du contenu occupant le reste de la largeur</p>
<p>partie avec du contenu occupant le reste de la largeur</p>
<br />
</div>
<br style="clear:both;"/>
</div>
<div id="pied">pied de page</div>
</div>
</body>
</html>



body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
margin: 0;
padding: 0;
background-color: #b9b9b9;
background-image:url(images/background.jpg);
background-repeat:repeat;
padding-top:140px;
}

#conteneur {
width: 620px;
margin: 0 auto;
}

#header {
background-image:url(images/header.jpg);
}

#bouton {
background-color: black;
background-image:url(images/middle_bck.jpg);
background-repeat:repeat;
}

#centre {

background-color: #cecece;
background-image:url(images/middle_bck.jpg);
background-repeat:repeat;
padding-right:10px;
padding-left: 10px;
}

#pied {
height: 30px;
background-color: #000000;
}
p {margin: 0;}

#blocgauche{
width:270px;
margin:0;
padding:0;
float: left;}

#blocdroit {
width:210px;
margin:0;
padding:0;
background: #EDEDED;
float: right;}

It's correct on Firefox but on IE i can't see the background of the "centre" div, why ?
Comments
18
▼
Quazz 23 Aug 2008, 23:27
dont use IE , problem solved
▼
flms 23 Aug 2008, 23:41
because IE automaticly closes the centre <div> when a new <div> is opened
▼
ScarZy 23 Aug 2008, 23:52
Not sure why tbh.

not done CSS for ages?
▼
finkregh 23 Aug 2008, 23:57
tell me if u finnished plz
▼
MindGamee 24 Aug 2008, 00:41
got link to what it looks like?
▼
amir 24 Aug 2008, 00:42
yes, just a moment :)
▼
suA 24 Aug 2008, 01:41
where is your opening body tag ?
▼
amir 24 Aug 2008, 01:50
i deleted him , i added it again what an idiot , this isn't the problem but thanks :)
Parent
▼
chosen 24 Aug 2008, 02:21
probably clean up your stylesheet:
padding-top: < dont use it, use

padding: TOPpx RIGHTpx BOTTOMpx LEFTpx; e.g. padding: 140px 0 0 0;

either use em or px, dont use both.

use background: url(path) position no-repeat #color;

dont use <br style="clear:both;"/>, make a css class and a div layer for it, it destroys your clean html.

the fixed high of 30px might destroy the white background from buttom to top in IE

this param thingy is not enough to get flash workin in IE, just use the proposed JS + flash from your exported flash and it shouldnt appear as a problem anymore.
▼
amir 24 Aug 2008, 03:28
Ok thanks chosen, I changed that but <br style="clear:both;"/> is necessary to stop the float when i delete it it doesn't work even on firefox.
About that flash thing i know, i will change it with that js+ flash code thing but i don't think that this is the solution.

Edit : still same

Thanks
Parent
▼
chosen 24 Aug 2008, 12:43
html:
<div class="clear"></div>

css:
.clear{ clear: both; }
Parent
▼
chosen 24 Aug 2008, 12:47

<script language="JavaScript" type="text/javascript">
if (AC_FL_RunContent == 0) {
alert("This page requires AC_RunActiveContent.js.");
} else {
AC_FL_RunContent(
'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0',
'width', '853',
'height', '325',
'src', 'v2',
'quality', 'high',
'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'align', 'middle',
'play', 'true',
'loop', 'true',
'scale', 'showall',
'wmode', 'window',
'devicefont', 'false',
'id', 'v2',
'bgcolor', '#ffffff',
'name', 'v2',
'menu', 'true',
'allowFullScreen', 'false',
'allowScriptAccess','sameDomain',
'movie', 'v2',
'salign', ''
); //end AC code
}
</script>
<noscript>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="853" height="325" id="v2" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="allowFullScreen" value="false" />
<param name="movie" value="v2.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<embed src="v2.swf" quality="high" bgcolor="#ffffff" width="853" height="325" name="v2" align="middle" allowscriptaccess="sameDomain" allowfullscreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /></embed>
</object>
</noscript> thats how it looks for me, np in both browsers. script => needs the exported thingy, noscript is the alternative but can bring issues if u communicate with js with flash and html.
Parent
▼
amir 24 Aug 2008, 21:52
thanks for that example, i will use that :)
Parent
▼
oBs 24 Aug 2008, 10:47
try adding "height: 100%" to the #centre rule.
▼
amir 24 Aug 2008, 21:52
Thanks, omg it works :)
Back to top