13, February 2012

few basic questions of css - webmaster forum

 
Webdigity webmaster forums
[ 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
Instabuck - The easy way to sell digital products online

Author Topic: few basic questions of css  (Read 1396 times)
OMG!I am geek
**
Posts: 53
406 credits
Members referred : 0


« on: Mar 19, 2008, 05: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;

}
OMG!I am geek
**
Posts: 53
406 credits
Members referred : 0


« Reply #1 on: Mar 19, 2008, 06: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: 5778
46265 credits
Members referred : 3



« Reply #2 on: Mar 19, 2008, 07: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
Join us @ facebook or twitter

Last blog : Butterfly Marketing 2.0
What's HTML?
****
Gender: Male
Posts: 408
2466 credits
Members referred : 2



« Reply #3 on: Mar 21, 2008, 01: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 : Offline Promotion Of Your Website
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....

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?
Feb 13, 2012, 05:11:38 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!






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