Hi

 

A header in a div, 5 buttons to the left in a div lined vertically and another div at the bottom of my site similar to my header. That 's the layout of my amature site. I am trying to insert images and text to my website but i am having problems navigating between those divs.

 

So far I have managed to do some navigation by inserting paragraphs of text within my buttons-div and make it float to the right and then margin it to align it properly at the center of my page.

 

Is there a different, better way??

You lost me in the first sentence! have you go a link where we can see what's going on?

You lost me in the first sentence! have you go a link where we can see what's going on?

 

Sorry, I wanst quiet myself when I was writting this thread. Here is my html code so far.

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

<head>

	<title> Suknie Slubne - Avalon </title>
	<link rel="stylesheet" type="text/css" href="header.css" />
	<link rel="stylesheet" type="text/css" href="mainbuttons.css" />

</head>

<body>

	<div id="headertop"></div>

	<div id="mainbuttons"> <!--Start of a div block including main buttons and link URLs-->

	<a href="StronaG.htm">
	<img src="StronaGlowna.jpg" id="StronaGlowna" class="button" alt="Strona Glowna" />
	</a>

	<br />

	<a href="Suknie.htm">
	<img src="Suknie.jpg" id="Suknie" class="button" alt="Suknie" />
	</a>

	<br />

	<a href="Akcesoria.htm">
	<img src="Akcesoria.jpg" id="Akcesoria" class="button" alt="Akcesoria" />
	</a>

	<br />

	<a href="Ofirmie.htm">
	<img src="Ofirmie.jpg" id="Ofirmie" class="button" alt="Ofirmie" />
	</a>

	<br />

	<a href="Kontakt.htm">
	<img src="Kontakt.jpg" id="Kontakt" class="button" alt="Kontakt" />
	</a>

	</div> 

	<div id="headerbottom"></div> <!--End of a div block including main buttons and link URLs-->

</body>

</html>

 

My problem starts here, as I have now a header, some buttons to the left of the page and a footer the same scale as the header.

 

I am trying now to insert images and text in the center of all this but whatever I do seems to mess up my buttons (sorry I know I am no good at explaining things). What I really want is to be able to put stuff in between the header, footer and to the rights of my buttons without moving any of them.

Please try this for starters... see the extra code and CSS I have put in...

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

<head>

<title> Suknie Slubne - Avalon </title>
<link rel="stylesheet" type="text/css" href="header.css" />
<link rel="stylesheet" type="text/css" href="mainbuttons.css" />

<style type="text/css">
/*<![CDATA[*/
#mainbuttons { float: left;
width: 200px;
}
#content {
float: left;
width: 640px;
}
/*]]>*/
</style>

</head>

<body>

<div id="headertop"></div>

<div id="mainbuttons"> <!--Start of a div block including main buttons and link URLs-->

<a href="StronaG.htm">
<img src="StronaGlowna.jpg" id="StronaGlowna" class="button" alt="Strona Glowna" />
</a>

<br />

<a href="Suknie.htm">
<img src="Suknie.jpg" id="Suknie" class="button" alt="Suknie" />
</a>

<br />

<a href="Akcesoria.htm">
<img src="Akcesoria.jpg" id="Akcesoria" class="button" alt="Akcesoria" />
</a>

<br />

<a href="Ofirmie.htm">
<img src="Ofirmie.jpg" id="Ofirmie" class="button" alt="Ofirmie" />
</a>

<br />

<a href="Kontakt.htm">
<img src="Kontakt.jpg" id="Kontakt" class="button" alt="Kontakt" />
</a>

</div>

<div id="content">

Your text here

</div>


<div id="headerbottom"></div> <!--End of a div block including main buttons and link URLs-->

</body>

</html>