Log in

View Full Version : Resolved Elements Not Aligning



Kage Kazumi
10-13-2012, 03:06 AM
I can't get my elements:


<div>
<p>
<span>


To align correctly. They look aligned in Dreamweaver durring "split" view:

4805

However, if you choose "live view" or view it in a web browser it looks like this: http://zanime.net/list/; unaligned.

How can I fix this?

CSS (HTML below)


@charset "UTF-8";
/* CSS Document */
#table{
width:500px;
height:inherit;
}
.table-title{
width:inherit;
height:inherit;
}
.text-wrapper{
width:inherit;
height:inherit;
}
.title-text{
width:200px;
height:16px;
float:left;
padding:2px;
}.os-icons{
width:200px;
height:16px;
float:right;
text-align:right;
padding:2px;
}
.table-description{
width:inherit;
height:145px;
padding:1px;
margin-top:1px;
}
.description-thumb{
width:100px;
height:100px;
float:left;
margin-right:15px;
padding-left:5px;
}
.table-text-description{
width:475px;
height:100px;
}
.table-footer{
width:inherit;
height:15px;
padding:2px;
}
.table-type{
width:200px;
height:inherit;
float:left;
padding-bottom:2px;
}
.table-price{
width:200px;
height:inherit;
float:right;
text-align:right;
padding-bottom:2px;
padding-right:2px;
}


HTML


<div id="table">
<div class="table-title">
<p class="title-wrapper">
<span class="title-text">Software Name</span>
<span class="os-icons">
<strong>OS</strong>:
<img class="windows" src="images/windows-logo-icon.png" />
<img class="mac" src="images/mac-logo-icon.png" />
<img class="linux" src="images/linux-logo-icon.png" />
</span>
</p>
</div>
<div class="table-description">
<p class="description-thumb">
<img src="images/sample-image.jpg" />
</p>
<p class="table-text-description">
The graphical scripter within 001 Game Creator is a simple, yet powerful method of creating events for your game without the difficulty of learning to write code. It uses the simplicity of pointing and clicking to allow the user to easily implement events in the form of a flowchart.
</p>
</div>
<div class="table-footer">
<span class="table-type">2D | 3D</span>
<span class="table-price">Free/Commercial</span>
</div>
</div>

ajfmrf
10-13-2012, 03:11 AM
<link rel="stylesheet" type="text/css" href="css/style.css">gives a "404 Not Found" error

You need to fix the url and that may be all you need to do

Kage Kazumi
10-13-2012, 03:16 AM
<link rel="stylesheet" type="text/css" href="css/style.css">gives a "404 Not Found" error

You need to fix the url and that may be all you need to do

That CSS files doesn't exist yet...or more like it is empty anyway.

Edit

The style.css is empty. It will be the design portion (color & any images). The layout.css is the one not working right... because I messed something up.

ajfmrf
10-13-2012, 04:55 AM
Is this more what you are looking for:
http://www.web-user.info/test/untitled1.html

If it is just check the adjustments in the css page

Kage Kazumi
10-13-2012, 05:26 AM
Yes, however, now my background image is pushing elements down instead of putting them on top of the background image: see here (http://zanime.net/list/)

v/Respectfully,
Kage

EDIT: Never Mind.