You are here: DEVPPL Forum Programming CSS Forum
NOTIFICATIONS
54.126
MEMBERS
15.697
TOPICS
62.285
POSTS
  562
FLASH GAMES
7.740
TUTORIALS
 

Login

E-mail:
Password:

Problem with layout

0

Loading

Problem with layout

Postby Woode » Sun Jul 17, 2005 11:56 pm

I am trying to work through a web design but only using CSS, instead of tables, and I am having a few problems....no surprise there...:)

I have started to create the page, and I have got this far.... not really knowing if I am using the cirrect CSS for this typoe of layout, and still
Last edited by Woode on Thu Mar 29, 2007 10:45 pm, edited 1 time in total.
Woode
 
Reputation: 0
Posts: 11
Joined: Mon May 23, 2005 12:00 am
Highscores: 0
Arcade winning challenges: 0

Problem with layout - Sponsored results

Sponsored results

Login to get rid of ads

 

0

Loading

Postby Rasmus Lindström » Mon Jul 18, 2005 12:06 am

When I do CSS layouts I use the float-command, some use fload and some use absolute position, but I think float gives a cleaner and faster code.

Take a look at the simplicity of this page:
http://www.party-poker-bonus-code.org

With the css:
http://www.party-poker-bonus-code.org/style.css

You can learn alot from that one, like centering the site and positioning DIVs. Look at that code, change yours and you will be more close to the final result. You can also take a look at the font-page here on devppl (not the forum) to look at a good DIV/CSS solution.

Read, fix and post your new result and we can help you futher with it. Good luck!
[url=http://www.linkedin.com/profile/view?id=96243938]Meet me on LinkedIn[/url]
[img]http://www.devppl.com/images/facebook_icon_small.jpg[/img] Help DEVPPL grow, [url=http://www.facebook.com/pages/DEVPPL/140524279390050]like DEVPPL on facebook[/url]!
Rasmus Lindström
Site Admin
 
Reputation: 18
Posts: 2830
Joined: Tue Aug 17, 2004 2:07 pm
Location: Sweden
Highscores: 1
Arcade winning challenges: 0
0

Loading

Postby Phate » Mon Jul 18, 2005 12:07 am

I am not entirely sure, but i think that you need to make the bigger table into two sections
Web-Developing since '03
Image
Phate
 
Reputation: 0
Posts: 826
Joined: Sun Nov 21, 2004 5:12 am
Location: 127.0.0.1
Highscores: 0
Arcade winning challenges: 0
0

Loading

Postby Woode » Mon Jul 18, 2005 7:44 am

hi, many thanks will take a look at the CSS, on both sites....just get a little cinfused as the best way to start, weather spltting into two...or one container and placing the images inside...
Woode
 
Reputation: 0
Posts: 11
Joined: Mon May 23, 2005 12:00 am
Highscores: 0
Arcade winning challenges: 0
0

Loading

Postby Rasmus Lindström » Mon Jul 18, 2005 10:15 am

Make one big conainer first thats like 700pixels width and 100% height and center that one. Then add the new DIVS inside that big container-div. A good thing could be to add different background-colors for the DIVs when testing, and when you are done and there are as you want them to be, just remove the backgounds or maybe replace them with other images.

To add background color for a div:
CSS:
Code: Select all
.div1 {
   background: #005500;
}


HTML:
Code: Select all
<div class="div1">hello</div>
[url=http://www.linkedin.com/profile/view?id=96243938]Meet me on LinkedIn[/url]
[img]http://www.devppl.com/images/facebook_icon_small.jpg[/img] Help DEVPPL grow, [url=http://www.facebook.com/pages/DEVPPL/140524279390050]like DEVPPL on facebook[/url]!
Rasmus Lindström
Site Admin
 
Reputation: 18
Posts: 2830
Joined: Tue Aug 17, 2004 2:07 pm
Location: Sweden
Highscores: 1
Arcade winning challenges: 0
0

Loading

Postby Woode » Mon Jul 18, 2005 4:45 pm

Thats cool, but how do i place the imges inside the container? As I seem to only be able to do by giving the first image an absolute setting, and then just placing the other image next to it!!!

Where I can I will use CSS for colours etc....

I presume that is right?

This all seems a little more complicated than just using a table and centreing that...:)
Woode
 
Reputation: 0
Posts: 11
Joined: Mon May 23, 2005 12:00 am
Highscores: 0
Arcade winning challenges: 0
0

Loading

Postby Shinz » Mon Jul 18, 2005 4:52 pm

webmaster wrote:When I do CSS layouts I use the float-command, some use fload and some use absolute position, but I think float gives a cleaner and faster code.


Absolute Position is kinda bad to use, because (i forgot which one it was, its been forever) if you make it a certain res site, and its viewed in a different res the site looks messed up OR if you minimize the window it will mess up the positioning of everything.

that used to piss me off
Shinz
 
Reputation: 0
Posts: 289
Joined: Thu Aug 26, 2004 5:06 pm
Location: PS7+C4D=Love
Highscores: 0
Arcade winning challenges: 0
0

Loading

Postby Rasmus Lindström » Mon Jul 18, 2005 5:02 pm

wood1e wrote:Thats cool, but how do i place the imges inside the container? As I seem to only be able to do by giving the first image an absolute setting, and then just placing the other image next to it!!!

Where I can I will use CSS for colours etc....

I presume that is right?

This all seems a little more complicated than just using a table and centreing that...:)


If you want you can use an orginary image-tag:
Code: Select all
<img src="image.jpg" alt="" />

Or add the image as a backgound in a DIV with the css command:[.div2 {
   background-image: url(image.jpg);
}
Rasmus Lindström
Site Admin
 
Reputation: 18
Posts: 2830
Joined: Tue Aug 17, 2004 2:07 pm
Location: Sweden
Highscores: 1
Arcade winning challenges: 0
0

Loading

Postby Woode » Mon Jul 18, 2005 6:31 pm

Oh I see...so simple!! Where was I going wrong tryingt o place two imagfe side by side..!!! :)
Woode
 
Reputation: 0
Posts: 11
Joined: Mon May 23, 2005 12:00 am
Highscores: 0
Arcade winning challenges: 0
^ Back to Top