problem with font sizes and em

HTML, CSS and anything else that deals with client side capabilities.

Moderator: General Moderators

Post Reply
mayanktalwar1988
Forum Contributor
Posts: 133
Joined: Wed Jul 08, 2009 2:44 am

problem with font sizes and em

Post 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
User avatar
kaszu
Forum Regular
Posts: 749
Joined: Wed Jul 19, 2006 7:29 am

Re: problem with font sizes and em

Post 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 */
Post Reply