Image Alignment is There any Other Way ????

Merely a quick question, I currently having a page and We have designed it around specific way the place that the banner aligns using a box which acts because the main content segment. I just were going to know if there seems to be anyway I perhaps have more control with the positioning of all the elements on the particular page. I know HTML has the precise alignment attributes, remaining, right, centre, prime e. t. c but there has to be anyway I can certainly control the motion a lil extra, maybe with quantity attributes like with photoshop

You have available CSS, like this kind of:

Ones HTML:

HTML:
< div class=" page" >
< div class=" main" >
< div class=" content" >
< h1> Hello there World! < /h1>
< /div>
< /div>
< div class=" banner" >
< img src=" banner ad. gif" />
< /div>
< /div>

Your CSS:

Code:
. web site
width: 960px;

. primary
width: 800px;
float: left;
overflow: concealed;

. content
padding: 20px;

. banner ad
width: 160px;
float: right;
overflow: concealed;

Now, the nice point about using CSS having floated divs is that one could nest divs in order to pad your content, or you incorporate the use of margins to alter the spacing.

However, you can apply absolute positioning, which allow you to lay out the page like a photoshop document:

Code:
human body
background-color: #eee;


. web site
background-color: #fff;
situation: absolute;
width: 800px;
peak: 600px;
top: 50px;
remaining: 120px;

. main
background-color: #fff;
line: solid 3px #ff00;
thicker: 580px;
position: most critical;
top: 100px;
remaining: 100px;

. content
underlay: 20px;

. banner
background-color: #fff;
line: solid 3px #00f;
thicker: 200px;
position: most critical;
top: 10px;
remaining: 700px;

Try them out and you should get a good sense of what’s going on.

This entry was posted in Web Design and tagged , , , , , , , , , , , , , , , , , , , . Bookmark the permalink.

Related Posts

Leave a Reply

Your email address will not be published. Required fields are marked *