13, May 2008

few basic questions of css - webmaster forum

 
Webdigity webmaster forums
This forum shares its ad revenue with its members!
[ Home | Help | Search | Forum's Shop | Archive | Login | Register | Webmaster Directory ]
Webdigity Webmaster Forums  >  Design and Layout  >  Web Page Design  >  CSS (Moderator: Meth0d)
Topic: few basic questions of css
« previous next »
Pages: [1] Print

Author Topic: few basic questions of css  (Read 253 times)
Cyberpunk Wannabe
*
Posts: 45
342 credits
Members referred : 0


« on: Mar 19, 2008, 06:47:24 AM »

after spending some time converting a site from psd to css i have a few probly basic questions for you guys.

i got a book on the subject, SitePoint The CSS Anthology and getting a little ahead of myself, but been something i been working on so i thought i would ask hehe

i have cade and image of problem is below

1) did a <li> list that will be a few links, the text is correct but the problem i am having is that when i added the line now i am getting a space in between my images. how do i correct that.

2) for the body of the page there will be 2 columns of text, one on the right (blue) and one left (gray), to do them i know will be 2 different class but to put them in the correct space would that be done with the text padding call?



html
Code:
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/strict.dtd">
<head>
<title>Cc2iscooL's Server Community</title>
<link rel="stylesheet" type="text/css" href = "test.css"  media="screen"  />
</head>
<body>
<div class="topbar"></div>
<div class="logo"></div>
<div class="midbar">
<ul class="menu">
<li>Forums</li>
<li>Stats</li>
</ul>
</div>
<div class="curve"></div>
<div class="body"></div>
<div class="page-bottom">Copyright&copy; 2008 Cc2iscooL's Server Community</div>
</body>
</html>

CSS
Code:
body {
background-color: 000000;
background-image: url(images/bg.jpg);
background-repeat: repeat-x;
padding: 0px;
margin: 0px;
background-attachment: scroll;
}
.topbar {
background-image: url(images/topbar.jpg);
background-repeat: no-repeat;
background-position: center top;
height: 20px;
}
.logo {
background-image: url(images/logo.jpg);
background-repeat: no-repeat;
background-position: center top;
height: 162px;
}
.midbar {
background-image: url(images/midbar.jpg);
background-repeat: no-repeat;
background-position: center top;
height: 48px;
}
.curve {
background-image: url(images/curve.jpg);
background-repeat: no-repeat;
background-position: center top;
height: 27px;
}
.body {
background-image: url(images/body.jpg);
background-repeat: no-repeat;
background-position: center top;
height: 882px;
}
body, ul {
font-family: TF2, Tahoma, Verdana, Arial, Helvetica, sans-serif;
text-align: center;
text-decoration: none;
}
ul.menu li {
display: inline;

}
.copyright {
font-family:  TF2, Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 8px;
color: #42BFF3;
text-align: center;

}
Cyberpunk Wannabe
*
Posts: 45
342 credits
Members referred : 0


« Reply #1 on: Mar 19, 2008, 07:58:34 PM »

well i fixed the space between the images with adding margin-top: 0; to the body,ul section. i kinda also figured out the text with using the absolute positioning, but not exactly what i was looking for, kinda want it to scale with the size of the page and keep its place, is there a way to do that and if so what would i be needing to learn in the CSS to do that?
I am a metal monkey!
Administrator
Community Supporter ?
Jedai Sword Master
*****
Gender: Male
Posts: 7824
39879 credits
Members referred : 3



« Reply #2 on: Mar 19, 2008, 08:46:21 PM »

Keeping the scale in XHTML stict is a little hard. You need to use relative positions and dimensions (using %)

If you want my opinion you should start by fixed dimensions and then play more, as it is harder to learn using the opposite.

Trial and Error my two best teachers Cool
Promote your blog for free.... Visit through proxy

Last blog : Keep it Legal - Tims guide to legal notices
So if I press Alt F4... What?
****
Gender: Male
Posts: 363
2192 credits
Members referred : 2



« Reply #3 on: Mar 21, 2008, 02:13:39 PM »

I assume you are talking about your text scaling

% and em as units will let your ALL browsers scale the texts to what the user has selected


Last blog : Free Consultation
Trackback URI for this entry : http://www.webdigity.com/trackback.php?topic=7664
Tags : css question basic Bookmark this thread : Digg Del.icio.us Dzone more....

Topic sponsors:
Get a permanent link here for $1.99!


Pages: [1] Print 
Webdigity Webmaster Forums  >  Design and Layout  >  Web Page Design  >  CSS (Moderator: Meth0d)
Topic: few basic questions of css
« previous next »
Jump to:
User Area
Welcome, Guest. Please login or register.
Did you miss your activation email?
May 13, 2008, 11:17:22 PM





Login with username, password and session length

Donate to our community, and get a permanent link back to your site!

Donate to our community, and get a permanent link back to your site!


Forum Statistics
Total Posts: 34.931
Total Topics: 7.262
Total Members: 3.482
Tutorials : 56
Resources : 143
Designs : 220
Latest Member: ondho

19 Guests, 4 Users online :

11 users online today:



Readers

Web Design Gallery · Whois Lookup · Pagerank · Tag Browsing · Lo-fi version · Syndication · Webmaster forum history · Advertise
Developed by HumanWorks © 2005 - 2008 Webdigity webmaster community · sublime directory
Webdigity Webmaster Forums | Powered by SMF 1.0.12. © 2001-2005, Lewis Media. All Rights Reserved.