div instead of tables

[Luigi Donatello Asero]

Needless to say I still need learn very much about CSS.
I am trying to use div instead of tables to reproduce a similar structure as
in www.scaiecat-spa-gigi.com/sv/valkommen.html
Unfortunately I find it difficult to have the text as high as the navigation
menu which is on the left.
Does perhaps IE not support <div> positioning or can I just have a div after
the other vertically but not horizontally?
I thought I could have two <div> at the same height giving the same value to
their "top" but it does not seem to work.
I tried to do it on the page www.scaiecat-spa-gigi.com/sv/testdue.html

- -
Luigi ( un italiano che vive in Svezia)



http://www.scaiecat-spa-gigi.com/sv/svezia.html
http://www.scaiecat-spa-gigi.com/sv/lagenheterhusrumitalien.html

 

[brucie]

In post <F%[email protected]>
Luigi Donatello Asero said...

I am trying to use div instead of tables to reproduce a similar structure as
in www.scaiecat-spa-gigi.com/sv/valkommen.html

http://usenet.alt-html.org/layout-thingy.html

 

[Luigi Donatello Asero]

In post <F%[email protected]>
Luigi Donatello Asero said...



http://usenet.alt-html.org/layout-thingy.html

What about having a menu on the left and another on the top as on
www.scaiecat-spa-gigi.com/sv/valkommen.html
Is that possible with <div>?

- -
Luigi ( un italiano che vive in Svezia)



http://www.scaiecat-spa-gigi.com/sv/svezia.html
http://www.scaiecat-spa-gigi.com/sv/lagenheterhusrumitalien.html

 

[brucie]

What about having a menu on the left and another on the top as on
www.scaiecat-spa-gigi.com/sv/valkommen.html
Is that possible with <div>?

yes. you just stick a <div> containing your other menu in the content
area.

 

[Luigi Donatello Asero]

yes. you just stick a <div> containing your other menu in the content
area.

Just
now I have this on the relative style sheet which I use on
www.scaiecat-spa-gigi.com/sv/test2.html
but the buttons on the left do not look like buttons.

p{

text-indent:5%;


}
body {
background-color: #ffffcc;
margin-left:auto;
margin-right:auto;}






H1 {
background-color:#CCFFFF;

font-size: 250%;
font-style: italic;
font-weight:bold;
text-align: center;

}


H2 {
background-color:#ffffcc;
font-size: 120%;
font-style: italic;
font-weight:bold;
text-align:left ;


}

H3 {
background-color:#FFCC66;

font-size: 100%;
font-style: italic;

text-align: center;

}


..c{color:#000000;

background:transparent;}






div{border:1px solid;}


#content{
background:#ffffcc;

position:relative;
margin-left:30%;


border:1px solid white;

}



#menu{color:blue;
background:#ffcc66;
border:1px solid red;
display:block;
position:relative;
float:left;
width:20%;

}

#head{color:blue;
background:#ffcc66;
position:relative;

font-style: italic;
font-weight:bold;


text-align: left;
border:1px solid red;
display:inline;
}
DIV.navigator{
background:#ffcc66;



border:1px solid white;
text-align:center;
}

..navigator1{color:blue;
background:#ffcc66;
border:1px solid red;
display:block;

}

..navigator2{color:blue;
background:#ffcc66;

font-style: italic;
font-weight:bold;


text-align: center;
border:1px solid red;
display:inline
}


- -
Luigi ( un italiano che vive in Svezia)



http://www.scaiecat-spa-gigi.com/sv/svezia.html
http://www.scaiecat-spa-gigi.com/sv/lagenheterhusrumitalien.html

 

[Richard]

Needless to say I still need learn very much about CSS.
I am trying to use div instead of tables to reproduce a similar
structure as
in www.scaiecat-spa-gigi.com/sv/valkommen.html
Unfortunately I find it difficult to have the text as high as the
navigation
menu which is on the left.
Does perhaps IE not support <div> positioning or can I just have a div
after
the other vertically but not horizontally?
I thought I could have two <div> at the same height giving the same
value to
their "top" but it does not seem to work.
I tried to do it on the page www.scaiecat-spa-gigi.com/sv/testdue.html

No problem.
<div> division one</div>
<div> division two</div>
Produces a field on top of a field.
Similar to:
<table>
<tr><td>division one</td></tr>
<tr><td>division two</td></tr>
</table>

You can also nest divisions a little easier than with tables.
With tables, you use rowspan and colspan, but with division, no need to.
Just use "position:absolute; left:10px; top:10px;"
<div id="name1">
<div id="name2">
<img src="filename">
</div>
<div class="name3"><center>
<img name="main" src="filename" height="250" width="250"></center>
</div>
name1 stuff goes here
</div>


This simple code produces 3 divisions. I have my css attributes set to float
division 2 to the right of division 1.
Division 3 is contained within division 2.

http://1-large-world.com/div1.html

Ok, don't be eating or drinking anything when you click on the link.
The page shows some ways of manipulating division tags.
It ain't perfect, but it gets the point across.

 

[Luigi Donatello Asero]

No problem.
<div> division one</div>
<div> division two</div>
Produces a field on top of a field.
Similar to:
<table>
<tr><td>division one</td></tr>
<tr><td>division two</td></tr>
</table>

You can also nest divisions a little easier than with tables.
With tables, you use rowspan and colspan, but with division, no need to.
Just use "position:absolute; left:10px; top:10px;"
<div id="name1">
<div id="name2">
<img src="filename">
</div>
<div class="name3"><center>
<img name="main" src="filename" height="250" width="250"></center>
</div>
name1 stuff goes here
</div>


This simple code produces 3 divisions. I have my css attributes set to float
division 2 to the right of division 1.
Division 3 is contained within division 2.

http://1-large-world.com/div1.html

Ok, don't be eating or drinking anything when you click on the link.
The page shows some ways of manipulating division tags.
It ain't perfect, but it gets the point across.

Hi Richard,
I have the divisions on the page www.scaiecat-spa-gigi.com/sv/test2.html
but the buttons on th menu on the left side do not seem to work as areas,
that means I can only click on the text of the link to open a new page, the
first time.
After clicking the first button however, I can click the others even using
the areas!!


- -
Luigi ( un italiano che vive in Svezia)



http://www.scaiecat-spa-gigi.com/sv/svezia.html
http://www.scaiecat-spa-gigi.com/sv/lagenheterhusrumitalien.html