firefox right click problem with fixed width floating divs

Forum Moderators: not2easy

Message Too Old, No Replies

firefox right click problem with fixed width floating divs

jakecoogle

1:57 am on Feb 17, 2008 (gmt 0)

I'm working on a design using fixed width divs to mimic a table. Here's some sample code:


<html>
<head>
<style>
div{
border:1px solid red;
width:498px;
height:500px;
overflow:auto;
}
.row {
width:496px;
height:248px;
}
.cell {
width:122;
height:246px;
float:left;
}
</style>
</head>
<body>
<div>
<div class="row">
<div class="cell">me</div>
<div class="cell">me</div>
<div class="cell">me</div>
<div class="cell">me</div>
</div>
<div class="row">
&nbsp;
</div>
</div>
</body>
</html>

if you view this in firefox and click on any of the one's that say "me", the last div will drop to the second line.

anyone have an idea on how to make that div stay put?

swa66

11:40 pm on Feb 17, 2008 (gmt 0)

First: tables for tabular data are ok, and can be styled using css.

I cannot reproduce your error (Firefox 2.0.0.12) with the code you provided.

I'd be careful with styling div itself (I'd give the outer div a class, and style that one), but it seems you know what you do there.

jakecoogle

2:02 pm on Feb 18, 2008 (gmt 0)

Thanks for your reply. Strangely though, Firefox 2.0.0.12 is the version I'm using as well. Either way though, I've been trying to switch over to what some would call "pure css" designs aka no tables. The ultimate solution to this was to make a wrapper class (sort of like what you said) as follows:

<html>

<head>

.row {
width:496px;
height:248px;
overflow:hidden;
}

.cell {
width:124px;
height:248px;
float:left;
border:none;
overflow:hidden;
}

.inner {
width:122;
height:246px;
}

</style>

</head>

</body>

</html>

Thanks again