Not following the faux column tutorial

liunx

Guest
okay, so someone posted the link to the faux column tutorial becuase thats the kinda design I was looking for. Anyways, i read it, and it made sense then i tried to apply it and it didn't work, all I get is the image that I made, but it isn't repeating,

this is my index.html file: (sorry its not in the code format, that didn't work...)

<html>
<head>
<link rel="stylesheet" type="text/css"
href=http://www.webdeveloper.com/forum/archive/index.php/"mystyle.css" />
</head>
<body>

<img src=http://www.webdeveloper.com/forum/archive/index.php/"background.jpg" id="ccc">
<style type="text/css">
{background-repeat: #ccc url(background.jpg)
repeat-y 50% 0;}

</body>
</html>



and this is my CSS file: (again, sry for formula)

{background-repeat: #ccc url(background.jpg)
repeat-y 50% 0;}

thanks,

Chris<style type="text/css">
body
{
background: url(background.jpg);
background-repeat: repeat-y;
}
</style>I have to add this to my HTML file? i can't add it someway to my CSS file? thats the point isn't it?

thanks anyways though.Just add the CSS part of it to your External Stylesheet. REmove the <style></style> tags, and pop the rest into your external file. ;)I tried that and it didn't work, this is my code:

Html:

<html>
<head>
<link rel="stylesheet" type="text/css"
href=http://www.webdeveloper.com/forum/archive/index.php/"mystyle.css" />
</head>
<a href=http://www.webdeveloper.com/forum/archive/index.php/"nextpage.html" text-indent: "1cm"> Next Page </a>
<body>

</body>
</html>

and my CSS:

a:link {text-indent= "1cm"}
a:link {color: white; font-weight: normal; text-decoration: none;}
a:visited {color: white; font-weight: normal; text-decoration: none;}
a:hover {color: white; font-weight: 900; text-decoration: underline;}
a:active {color: white; font-weight: normal; text-decoration: none;}
body
{
background: url(background.jpg);
background-repeat: repeat-y;
}Originally posted by Chrisab508
<a href=http://www.webdeveloper.com/forum/archive/index.php/"nextpage.html" text-indent: "1cm"> Next Page </a>
Should be

<a href=http://www.webdeveloper.com/forum/archive/index.php/"nextpage.html" style="text-indent:1cm;"> Next Page </a>

Well, as long as the CSS you gave is the only stuff in the external stylesheet, and you have the file path right, I don't know what the problem might be... :(HAHAHA, fixed my own problem sorry i pestured you guys, but in my HTML i told it to link to mystyle.css, however, my stylesheet was called : stylesheet.css

stupid mistake, but one nonetheless, thanks for the help guys!!Oh, wow, made a typo up there in my last post. :o

Anyhoo, glad you got it fixed! I am plagued by such problems myself more times than I'd like to admit. :plol i think im having another problem, but im gonna try and fix it myself!!

thanksokay, if I add a frame to my middle column, not for the design but to keep the text in that center column so it doesn't go out to the left and right columns, will that be okay??

thanks

Chrisin my above post i dno if its a frame, but just something that allows me to just put text in the middle column, because my design is just acting as a background, and not any formatting, or anything else.

thanks.We don't have much to go on but I think what you need is a div with an id like "content" to hold that text. You'd then defined how "content" looks in a #content {} section in your style sheet.okay, i was thiknig a div as well, except i couldn't find a tutorial on how to define what it would be, so I have no idea what to go with, plus I don't know how to make it in the middle.

thanksokay this is what i have"

HTML code:

<html>
<head>
<link rel="stylesheet" type="text/css"
href=http://www.webdeveloper.com/forum/archive/index.php/"stylesheet.css" />
</head>
<a href=http://www.webdeveloper.com/forum/archive/index.php/"nextpage.html" style="text-indent: 4.5cm;"> Next Page </a>
<body>
<div id=content

<p> BLAH BLAH BlaHBLAH BLAH BlaHBLAH BLAH BlaHBLAH BLAH BlaHBLAH BLAH BlaHBLAH BLAH BlaHBLAH BLAH BlaHBLAH BLAH BlaHBLAH BLAH BlaHBLAH BLAH BlaHBLAH BLAH BlaHBLAH BLAH BlaHBLAH BLAH BlaHBLAH BLAH BlaHBLAH BLAH BlaH<p>
</div>

</body>
</html>


and CSS:

a:link {color: darkblue; font-weight: normal; text-decoration: none;}
a:visited {color: darkblue; font-weight: normal; text-decoration: none;}
a:hover {color: blue; font-weight: normal; text-decoration: underline;}
a:active {color: darkblue; font-weight: normal; text-decoration: none;}

body
{
background: url(background3.jpg);
background-repeat: repeat-y;
}


#content{
float: center;
width="50%";
position: absolute;
width: 560px;

}


i dno if i did the div right , cuz my text is all the way to the left where it would be had i just typed it in (which is what i did)

thanksi figured it out, well not me, but I found it online, this is what i added to my CSS:

#content{
width: 500px;
padding: 0px 0px 0px 0px;
text-align: left;
}

and this to the body part of my css:
style=margin-left: auto;
margin-right: auto;
text-align: center;


thanks again guysJust to clean up a bit,

#content {
width: 500px;
padding: 0;
text-align: left;
}

body {
margin: auto;
text-align: center;
}

On the padding -- a single value applies to all sides and zero values don't need dimensions.

On the body -- factored the style out of the tag and into the style sheet; no need to duplicate the margin in this case.
 
Back
Top