Page 1 of 1

problem with font sizes and em

Posted: Fri Oct 02, 2009 8:12 am
by mayanktalwar1988

Code: Select all

<style>
body
{ 
background-color:#d9e8e6;
}
 
div.mainbox
{
position:fixed;
background-color:#ffffff;
border-style:solid;
border-width:1px;
width:60%;
left:20%;
top:15%;
}
 
div.one
{
font-size:19.2px;
width:75.4%;
float:left;
text-align:jusitfy;
color:#6e3e04;
min-height:100px;
}
div.headingone
 
{
font-size:16px;
width:75.4%;
float:left;
background-color:#bababa;
 
}
 
div.headingtwo
{
font-size:16px;
 
 
float:right;
background-color:#bababa;
 
}
 
div.second
{
color:#6e3e04;
position:relative;
float:right;
right:12%;
top:2%;
font-size:19.2px;
min-height:100px;
 
}
 
div.secondsecond
{
 
 
position:relative;
float:right;
color:#6e3e04;
font-size:19.2px;
min-height:100px;
right:50%;
}
div.oneone
{
font-size:1.2px;
 
width:75.4%;
background-color:#baecab;
float:left;
color:#6e3e04;
text-align:justify;
min-height:100px;
}
 
a
{
color:#6e3e04;
 
text-decoration:none;
font-size:16px;
 
}
 
div.justforcolor
{
float:right;
width:24.3%;
background-color:#baecab;
}
h1.one
{
position:relative;
left:30%;
}
</style>
 
 
 
 
<?php
include("mysql_connect.php");
echo"<div class=\"mainbox\">";
//echo "<a href='create_topic.php'>New topic</a>";
echo "<div class=\"headingone\"> <h1 class=\"one\">cccccccc</h1></div>
 
<div class=\"headingtwo\"><h1>ccccc ccccccccc</h1></div> ";
 
 
$sql = mysql_query("SELECT * FROM category ORDER BY cat_id ");
$i=0;
while($row = mysql_fetch_array($sql)) {
$i=$i+1;
$topics = mysql_num_rows(mysql_query("SELECT * FROM topics WHERE cat_id='".$row['cat_id']."'"));
$replies = mysql_num_rows(mysql_query("SELECT * FROM replies WHERE cat_id='".$row['cat_id']."'"));
if($i%2==0)
{
echo "<div class=\"one\"><a href='topic.php?pagenum=1&id=".$row['cat_id']."'>".htmlentities($row['category_topic'])."</a></div>
 
<div class=\"second\">".$topics."</div>";
}
 
 
if($i%2==1)
{
echo "<div class=\"oneone\"><a href='topic.php?pagenum=1&id=".$row['cat_id']."'>".htmlentities($row['category_topic'])."</a></div>
<div class=\"justforcolor\">
<div class=\"secondsecond\">".$topics."</div>
</div>";
}
}
 
echo"</div>";
mysql_close($con);
?>
 
 



my question is that first the div tag with one and oneone class is not following the fontsize which i declare in as css means it only follows the browser but not the css ...suppose if browser is at 16 px then no matter what value you pass in font size it will remain fix at 16 px...althoug the second and secondsecond class follow the css rule and follow the fontsize laid by css in style tags..where is the prob




and second thing supose if i use em then the problem as above exist but another problem suppose the user change the font size in browser then the layout become abrupt what to do to make layout follow the line as it was suppose to

Re: problem with font sizes and em

Posted: Sun Oct 04, 2009 6:04 am
by kaszu
You have set A font-size to 16px, so changing div.oneone font size has no effect of course

Code: Select all

<div class="oneone"><a ...
 

Code: Select all

div.oneone { font-size: 19.2px; } /* DIVs font size is set to 19.2px */
a { font-size: 16px; } /* A font-size is set to 16px, div.oneone doesn't affect A */