Pixelpost

**raminia**+ · #1 05-08-2005, 06:37 AM

Hi folks,
I know I can go through tutorials and sneak through lines of codes to find out how to do this but I need some directed help to the point

as you see here in pepper template

the two field of image note and exif information are residing side by side. I want to do so with CSS and div tags. I know how to do it with tables but I want to learn doing such stuff with DIV.

(I'm going to design my personal template

)

#2 05-08-2005, 08:17 AM

Raminia,

did you take a look into the CSS of pepper's template?

Things like this are done by <div>s, which have the attribute "float:left" or "float:right"

Code:

&lt;html xmlns="http://www.w3.org/1999/xhtml">
&lt;head>
&lt;title>two boxes for Ramin&lt;/title>
&lt;style type="text/css">
#number_one {
border: 1px solid #000000;
width: 200px;
float: left;
margin-right: 10px;
background-color:white;color:black;
margin-bottom:10px;
}
#number_two{
border: 1px solid #000000;
width: 200px;
float: left;
background-color:white;color:black;
margin-bottom:10px;
}
&lt;/style>
&lt;/head>
&lt;body bgcolor="#FFFFFF" text="#000000" link="#0000FF" vlink="#800080" alink="#FF0000">
&lt;div id="number_one">number one &lt;/div>
&lt;div id="number_two">number two&lt;/div>
&lt;/body>
&lt;/html>

so this example gives you the basics for two boxes, side by side

test it with this example-page

**raminia**+ · #3 05-08-2005, 07:22 PM

Thanks Connie. That was very helpful

Pixelpost

Authentic Photoblog Flavour