I need help with my layout., I need help with the link coding... |
 Aug 24 2008, 02:00 PM
Post
#1
|
|
 Irrisistable Cabbages.  Group: Member Posts: 549 Joined: Nov 2007 Member No: 589,355  |
I need help with the coding of the links.
I am trying to get only one link on a line. Like This One. This Is My Coding for my layout: CODE body{background:#fff url('http://img182.imageshack.us/img182/7577/bodybg2in2.png') repeat-y;text-align: normal;margin: 00px 0 00px 0} div,body{font: 9px georgia;color: #969593;line-height: 11px;} ul{list-style-type:circle;color:000;line-height: 12px;} #content{position:absolute;width:750px;left:165px;top:480px;z-index:1;} #side1{position:absolute;width:156px;left:2px;top:480px;z-index:2;} #side2{position:absolute;width:164px;left:922px;top:479px;z-index:2;} #content h1{background-color: pink;letter-spacing: 0px;font-family: arial black;font-size: 9px;color:hotpink;font-weight: normal;padding-top: 4px;padding-bottom: 4px;margin-bottom:6px;margin-top:0px;padding-right:6px;text-align: right;text-transform: uppercase;border-bottom: 1px dotted #9ca892;} #content a:hover{text-decoration: none;color: purple;font-weight:none;letter-spacing:0px} #content a:link,a:active{text-decoration: none;color: #000;font-weight:none;letter-spacing:0px;} #content a:visited{text-decoration: none;color: #000;font-weight:none;letter-spacing:0px;} #side1 h3{background-color: hotpink;letter-spacing: 0px;font-family: arial black;font-size: 9px;color:pink;font-weight: normal;padding-top: 4px;padding-bottom: 4px;margin-bottom:6px;margin-top:0px;padding-right:6px;text-align: right;text-transform: uppercase;border-bottom: 1px dotted #9ca892;} #side1 a:hover{text-transform : none;border-bottom: 1px dotted #000000;color: purple;font-weight:none;letter-spacing:0px;} #side1 a:link,a:visited,a:active{text-decoration: none; text-transform : none;color: #000;font-weight:none;letter-spacing:0px; line-height: 11px;background:brown;} #side2 h3{background-color: #dfe0df;letter-spacing: 0px;font-family: arial black;font-size: 9px;color:p;font-weight: normal;padding-top: 4px;padding-bottom: 4px;margin-bottom:6px;margin-top:0px;padding-right:6px;text-align: right;text-transform: uppercase;border-bottom: 1px dotted #9ca892;} #side2 a:hover{text-decoration: underline; text-transform : none;border-bottom: 1px dotted #000000;color: purple;font-weight:none;letter-spacing:0px;} #side2 a:link,a:visited,a:active{text-decoration: none; text-transform : none;color: #000;border-bottom: 1px dotted #000000;font-weight:none;letter-spacing:0px;} That is the coding I have. I don't know what I should change. Ask me if you need all of the code inclueding the text. |
|
|
|
 |
Replies
(1 - 14)
|
Aug 24 2008, 02:10 PM
Post
#2
|
|
 AKA RockIt Studios Group: Official Member Posts: 2,286 Joined: Jun 2006 Member No: 421,809 |
your CSS has nothing to do with it. please give us a screenshot and the rest of your coding.
also, is this a website or myspace layout? |
|
|
|
|
Aug 24 2008, 02:36 PM
Post
#3
|
|
|
Irrisistable Cabbages. Group: Member Posts: 549 Joined: Nov 2007 Member No: 589,355 |
This is a website layout. Do you mean a screenshot of my layout or my coding? I'll give you both.
  |
|
|
|
|
Aug 24 2008, 02:38 PM
Post
#4
|
|
 asdfghjkl; Group: Official Designer Posts: 1,121 Joined: Jul 2008 Member No: 665,416 |
have you tried just putting a simple br?
CODE <BR>
|
|
|
|
|
Aug 24 2008, 02:38 PM
Post
#5
|
|
|
AKA RockIt Studios Group: Official Member Posts: 2,286 Joined: Jun 2006 Member No: 421,809 |
ok, i see what you need, but please post the rest of your coding. :]
|
|
|
|
|
Aug 24 2008, 02:39 PM
Post
#6
|
|
|
Irrisistable Cabbages. Group: Member Posts: 549 Joined: Nov 2007 Member No: 589,355 |
I don't quite have the text all in the right places on the screenshot of my site
|
|
|
|
|
Aug 24 2008, 02:40 PM
Post
#7
|
|
|
Irrisistable Cabbages. Group: Member Posts: 549 Joined: Nov 2007 Member No: 589,355 |
ok here is all of my coding. From top to bottom (without the extra text in the background.)
CODE <html> <head> <title>Sugar-Blossom.net</title> <style type="text/css"> b {font-weight: bold; color: #b77de1;} u {text-decoration: underline; border-bottom: 2px solid #f3e6b8; color: #e7b2ab;} i {font-style: italic; color: #f294b4; font-weight: bold;} p {margin: 0; margin-bottom: 8px;} #content A:link, #content A:visited { text-decoration: none; color:#7dda7e; cursor: crosshair; font-family: arial; font-weight: bold; border-bottom: 1px dashed #c6c6c6;} #content A:hover { text-decoration:none; color:#f38181; cursor: crosshair; font-family: arial; border-bottom: 3px double #c6ffb8; } #navi A, #navi A:link, #navi A:visited { display:block; margin:1px; margin-left:1px; margin-right:1px; ; padding:1px; letter-spacing: 1px; cursor: crosshair; text-decoration:none; color:#fc93ae; font-family: arial; font-weight: bold; text-align: center;} #navi A:hover { text-decoration:none; color:#75d16f; font-family: arial; font-weight: bold; text-align: center; border: none;} body { cursor: ne-resize; background-color:#e5dffc; margin:0px; text-align: justify; min-width: 700px; background-image:url(http://img142.imageshack.us/img142/2562/bodybg2qd1.png); background-repeat:repeat-y; font-family:tahoma, arial; font-size: 11px; line-height: 16px;} #content {width:385px; position:absolute; left:240px; top:520px; color:#666666; } #navi {width:167px; position:absolute; left:44px; top:520px; color: #a295de; text-align: justify;} h1 { display: block; font-family: "century gothic"; font-size: 18px; font-weight: normal; height: 36px; text-align: right; color: #a586b5; background: url(http://cbimg9.com/layouts/08/08/30242ah.jpg) no-repeat; padding-top: 8px; padding-right: 15px; margin: 0;} h2 { display: block; margin-left: 1px; font-size: 16px; height: 34px; text-align: center; color: #e497c7; font-weight: bold; background: url(http://cbimg9.com/layouts/08/08/30242ai.jpg) no-repeat; padding-top: 7px; padding-right: 2px; margin: 0;} </style></head> <BODY BGCOLOR="#fff" LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0> <TABLE WIDTH=800 BORDER=0 CELLPADDING=0 CELLSPACING=0> <TR> <TD> <IMG SRC="http://img142.imageshack.us/img142/7083/headerbg2pj8.png" ALT="" usemap="#Map" BORDER="0"></TD> </TR></TABLE><body> <div id="navi"><center> <h2>About Me?</h2> <center><img src="http://cbimg9.com/layouts/08/08/30242af.jpg" border="0"></center> <br>You can talk about random stuff here... I dunno. Short introduction of your site? Or yourself? Maybe write about your latest site updates. Or put some pictures here (but the width of the picture shouldn't exceed 150 pixels). Well, you decide. =)<br> <br><h2>Navigation</h2> <a href="#">Home</a> <a href="#">Visitor Content</a> <a href="#">Guestbook</a> <a href="#">About The Site</a> <a href="#">Webmistress</a> <a href="#">Affiliates</a> <a href="#">Links Out</a> <br><h2>Credits</h2> Layout By:<a href="http://dreamgurl36.createblog.com" target="_blank"> dreamgurl36</a> </center> </div> <div id="content"> <h1>About This Layout....</h1> <p>This is where your <i>main content</i> will go. Fill up as much or as little as you want! XD It's all up to you!</p> <p>Please do not alter the images/layout in any way. And it goes without saying.... <b>do not remove the credit</b>. I mean... I've taken the time to code this, so the least you can do is leave the credit there. But of course.... you may edit the navigation, contents, and such to suit your website needs. I think you'd need some basic knowledge of <u>HTML and CSS</u> to be able to fully make use of this layout. But it's nothing too complicated. There are plenty of tutorials on the web, and even some on <a href="http://www.createblog.com" target="_blank">CreateBlog</a> too.</p> <p>This layout was tested in both Internet Explorer and Firefox. In Firefox, the font of the text will be slightly different. Other than that, it works perfectly fine.... compatible in <b>both</b> browsers. ^^ Oh, and it works in <i>all resolutions</i> too. :) Hope you enjoy it!</p> <center><b>This is bold text.</b><br> <u> This is underlined text.</u><br> <i>This is italic text.</i><br> <a href="#" target="_blank">This is a link</a> </center> <br><h1>Header Title Goes Here</h1> <p>content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content</p> <p>content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content</p> <p>content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content</p> </div> </body> </html> |
|
|
|
|
Aug 24 2008, 02:45 PM
Post
#8
|
|
|
Irrisistable Cabbages. Group: Member Posts: 549 Joined: Nov 2007 Member No: 589,355 |
QUOTE(nikx618 @ Aug 24 2008, 02:38 PM)  have you tried just putting a simple br? CODE <BR> yes but I liked the way that other person did hers. |
|
|
|
|
Aug 24 2008, 02:46 PM
Post
#9
|
|
|
AKA RockIt Studios Group: Official Member Posts: 2,286 Joined: Jun 2006 Member No: 421,809 |
all you need to do is add a line break after each link.
CODE <br />
|
|
|
|
|
Aug 24 2008, 02:48 PM
Post
#10
|
|
|
Irrisistable Cabbages. Group: Member Posts: 549 Joined: Nov 2007 Member No: 589,355 |
Do you know how she did hers? I mean with the background and left border. I'm not stupid (if that is what you are thinking) I know a lot of coding just not that.
|
|
|
|
|
Aug 24 2008, 02:53 PM
Post
#11
|
|
|
AKA RockIt Studios Group: Official Member Posts: 2,286 Joined: Jun 2006 Member No: 421,809 |
all she (or he) did was place all of her navigation in a DIV, then styled it with CSS.
CODE #navi a, #navi a:link, #navi a:active, #navi a:visited { color:#c4689d; font-size:10px; font-family:arial; line-height:15px; display:block; text-align: left; text-transform: uppercase; letter-spacing: none; text-decoration: none; background-color: #f3f3f3; color: #cd1a55; font-style: normal; padding: 0px 0px 2px 2px; border-left: 3px solid #f16c98; } #navi a:hover, #navi a:focus { color:#765183; cursor: default; text-align: right; text-decoration: none; font-style: none; padding-right: 3px; background: #e5cff0 url(); border-left: 3px solid #9f78ad; } CODE <h4>Menu</h4> <div id="navi"> <a href="#">Home</a> <a href="#">Link</a> <a href="#">Link</a> <a href="#">Link</a></div> <div id="navi2"> <a href="#">Link</a></div> <p> DO NOT TAKE THAT CODING! I just posted it (and probably shouldn't have) for an example. don't copy and paste, don't type it letter from letter. take that bit of codes as an example and do it yourself. |
|
|
|
|
Aug 24 2008, 02:56 PM
Post
#12
|
|
|
Irrisistable Cabbages. Group: Member Posts: 549 Joined: Nov 2007 Member No: 589,355 |
I know but that is a good note for other users. I know not to just steal coding. I give credit where it is needed.
|
|
|
|
|
Aug 24 2008, 02:57 PM
Post
#13
|
|
|
Irrisistable Cabbages. Group: Member Posts: 549 Joined: Nov 2007 Member No: 589,355 |
thanks!
|
|
|
|
|
Aug 24 2008, 03:03 PM
Post
#14
|
|
|
Irrisistable Cabbages. Group: Member Posts: 549 Joined: Nov 2007 Member No: 589,355 |
Do you want to see my site when it is done?
|
|
|
|
|
Aug 24 2008, 04:26 PM
Post
#15
|
|
 Senior Member Group: Staff Alumni Posts: 2,435 Joined: Feb 2007 Member No: 506,205 |
Topic closed and moved to Resolved.
|
|
|
|
 |
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members: