Log In · Register

 
Livejournal Layout Confusion, Just completely confused
xxangel
post Aug 6 2006, 01:38 PM
Post #1


Newbie
*

Group: Member
Posts: 2
Joined: Feb 2005
Member No: 104,515
I've attempted to code layouts in LJ before, but they've all failed. I'm just completely and utterly lost when it comes to coding in LJ. I have the layout completely coded outside of LJ, and you can see it here:

CODE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>a caravan of fortunes</title>
<style type="text/css">

<!--

body {
cursor: default;
font-size: 0.8em;
font-family: verdana, arial;
color: #516F9F;
background: url("http://img357.imageshack.us/img357/9660/backgrounduu0.gif");
margin: 0;
padding: 0;
}

#container {
border-left: 10px solid #516F9F;
border-right: 10px solid #516F9F;
width: 505px;
min-height: 100%;
background: url("http://img182.imageshack.us/img182/2776/bgnk4.gif");
margin: 0 auto;
}

#top {
width: 505px;
height: 212px;
background: url("http://img303.imageshack.us/img303/4861/mainss0.gif");
}

#left {
float: left;
width: 158px;
padding-left: 14px;
font-size: 0.8em;
}

#right {
float: right;
width: 315px;
padding-right: 6px;
font-size: 0.8em;
}

#footer {
clear: both;
width: 505px;
height: 31px;
background: url("http://img371.imageshack.us/img371/6250/footeraz9.gif");
}

h1 {
font-weight: bold;
font-size: 1.4em;
font-family: arial, verdana;
padding: 0;
margin: 0 0 7px 0;
}

h2 {
font-weight: bold;
font-size: 1.4em;
font-family: arial, verdana;
padding: 0;
margin: 0;
text-align: right;
text-decoration: underline;
}

h2:first-letter {
border: 1px solid;
padding: 5px;
font-size: 1.3em;
background: #E6EBF2;
}

.icon {
float: left;
width: 104px;
height: 104px;
background: #E6EBF2;
margin-right: 5px;
}

.links {
font-size: 1.1em;
text-align: right;
padding: 2px 0px 2px 0px;
margin: 5px 0 5px 0;
background: #E4EAF3;
}

.links ul {
margin: 0px;
padding: 0px;
}

.links li {
padding: 0px 7px 0px 7px;
margin: 0px;
display: inline;
}

a {
text-decoration: none;
color: #3E5C8A;
cursor: default;
}

a:hover {
text-decoration: underline;
cursor: default;
}

h3 {
font-weight: normal;
font-size: 0.9em;
text-align: right;
margin: 0 0 7px 0;
color: #7691B8;
}
-->
</style>

</head>

<body>
<div id="container">
<div id="top"></div>
<div id="left">
<h1>About Me</h1>
I am a girl
</div>
<div id="right">
<h2>Summer 2006 Volunteer Trip</h2>
<h3>4th-Aug-2006 03:11 pm</h3>
<div class="icon">
</div>
Test test test test</b>
<div class="links">
<ul>
          <li><a href="http://yingna.livejournal.com/7191.html">Read 2</a></li><li><a href="http://yingna.livejournal.com/7191.html?mode=reply">Speak</a></li><li><a href="http://yingna.livejournal.com/7191.html">Link</a></li><li><a href="http://www.livejournal.com/editjournal.bml?journal=yingna&amp;itemid=7191">Edit</a></li><li><a href="http://www.livejournal.com/edittags.bml?journal=yingna&amp;itemid=7191">Edit Tags</a></li><li><a href="http://www.livejournal.com/tools/memadd.bml?journal=yingna&amp;itemid=7191">Remember</a></li>

          </ul>
</div>
</div>
<div id="footer"></div>
</div>
</body>
</html>


However, the only thing I got up to in my LJ was this:

CODE
GLOBAL_HEAD<=

<style type="text/css">

<!--

body {
cursor: default;
font-size: 0.8em;
font-family: verdana, arial;
color: #516F9F;
background: url("http://img357.imageshack.us/img357/9660/backgrounduu0.gif");
margin: 0;
padding: 0;
}

#container {
border-left: 10px solid #516F9F;
border-right: 10px solid #516F9F;
width: 505px;
min-height: 100%;
background: url("http://img182.imageshack.us/img182/2776/bgnk4.gif");
margin: 0 auto;
}

#top {
width: 505px;
height: 212px;
background: url("http://img303.imageshack.us/img303/4861/mainss0.gif");
}

#left {
float: left;
width: 158px;
padding-left: 14px;
font-size: 0.8em;
}

#right {
float: right;
width: 315px;
padding-right: 6px;
font-size: 0.8em;
}

#footer {
clear: both;
width: 505px;
height: 31px;
background: url("http://img371.imageshack.us/img371/6250/footeraz9.gif");
}

h1 {
font-weight: bold;
font-size: 1.4em;
font-family: arial, verdana;
padding: 0;
margin: 0 0 7px 0;
}

h2 {
font-weight: bold;
font-size: 1.4em;
font-family: arial, verdana;
padding: 0;
margin: 0;
text-align: right;
text-decoration: underline;
}

h2:first-letter {
border: 1px solid;
padding: 5px;
font-size: 1.3em;
background: #E6EBF2;
}

.icon {
float: left;
width: 104px;
height: 104px;
background: #E6EBF2;
margin-right: 5px;
}

.links {
font-size: 1.1em;
text-align: right;
padding: 2px 0px 2px 0px;
margin: 5px 0 5px 0;
background: #E4EAF3;
}

.links ul {
margin: 0px;
padding: 0px;
}

.links li {
padding: 0px 7px 0px 7px;
margin: 0px;
display: inline;
}

a {
text-decoration: none;
color: #3E5C8A;
cursor: default;
}

a:hover {
text-decoration: underline;
cursor: default;
}

h3 {
font-weight: normal;
font-size: 0.9em;
text-align: right;
margin: 0 0 7px 0;
color: #7691B8;
}

table, tr, td, .shadowed {
background: transparent;
}

-->
</style>


<=GLOBAL_HEAD

LASTN_WEBSITE<=

<div id="container">
<div id="top"></div>
<div id="left">
<h1>About Me</h1>
I am a girl
</div>
<div id="right">

<=LASTN_WEBSITE


And the LASTN_WEBSITE thing doesn't show up in my LJ. Can anyone give me a start in the code...like start it so I know how it looks?
 
 
 Start new topic
Replies
xxangel
post Aug 6 2006, 03:07 PM
Post #2


Newbie
*

Group: Member
Posts: 2
Joined: Feb 2005
Member No: 104,515
Thanks for the help and coding, and it does help me get a start. But, I just want to ask if there's a way to write coding AFTER the entries? Because, my layout requires coding to go in after the entries.

I'm tweaking the coding to make it look a little better until I get an answer to the question.

Edit: I made the layout look somewhat okay on IE (missing footer and I couldn't get rid of the margins) but that was only because I was using the dysfunctions of IE to my advantage (if I could only add something AFTER the entries, then my layout would look all right). On all other browsers, my layout looks messed up.

BTW, I'm also using the layout style of Magazine instead of Generator and the coding is now:

CODE
GLOBAL_HEAD<=
<style type="text/css">

<!--

body {
cursor: default;
font-size: 0.8em;
font-family: verdana, arial;
color: #516F9F;
background: url("http://img357.imageshack.us/img357/9660/backgrounduu0.gif");
margin: 0;
padding: 0;
}

h1, .Navigation {
display: none;
}

#container {
border: 10px solid #516F9F;
width: 505px;
min-height: 100%;
background: url("http://img182.imageshack.us/img182/2776/bgnk4.gif");
margin: 0 auto;
}

#top {
width: 505px;
height: 212px;
background: url("http://img303.imageshack.us/img303/4861/mainss0.gif");
}

#left {
float: left;
width: 158px;
padding-left: 14px;
font-size: 0.8em;
}

h4 {
font-weight: bold;
font-size: 1.4em;
font-family: arial, verdana;
padding: 0;
margin: 0 0 7px 0;
}

#footer {
clear: both;
width: 505px;
height: 31px;
background: url("http://img371.imageshack.us/img371/6250/footeraz9.gif");
}

h2 {
font-weight: bold;
font-size: 1.4em;
font-family: arial, verdana;
padding: 0;
margin: 4px 0 0 0;
text-align: right;
text-decoration: underline;
border-bottom: 0;
}

h2:first-letter {
border: 1px solid;
padding: 5px;
font-size: 1.3em;
background: #E6EBF2;
text-decoration: none;
}

.icon {
float: left;
width: 104px;
height: 104px;
background: #E6EBF2;
margin-right: 5px;
}

.links {
font-size: 1.1em;
text-align: right;
padding: 2px 0px 2px 0px;
margin: 5px 0 5px 0;
background: #E4EAF3;
}

.links ul {
margin: 0px;
padding: 0px;
}

.links li {
padding: 0px 7px 0px 7px;
margin: 0px;
display: inline;
}

a {
text-decoration: none;
color: #3E5C8A;
cursor: default;
}

a:hover {
text-decoration: underline;
cursor: default;
}

#right {
float: right;
width: 315px;
padding-right: 6px;
font-size: 0.8em;
background: #CDD8E9;
}

.H3Holder {
width: 315px;
border: 0;
margin: 0;
padding: 0;
}

h3 {
font-weight: normal;
font-size: 1.0em;
text-align: right;
margin: 0 0 7px 0;
color: #7691B8;
}

h3 span {
border: 0;
padding: 0;
}
-->
</style>
<=GLOBAL_HEAD

LASTN_WEBSITE<=
<div id="container">
<div id="top"></div>
<div id="left">
<h4>About Me</h4>
I am a girl
</div>
<div id="right">
<=LASTN_WEBSITE

LASTN_TALK_LINKS<=
<div class="links">
<ul><li>
<a href="%%urlread%%">Read</a></li>
<li><a href="%%urlpost%%">Speak</a></li>
</ul>
</div>
<=LASTN_TALK_LINKS


Second Edit: Since no one answered my question yet, I just went with s2 and did tweaking to another template. But, it doesn't allow me to really write anything (HTML-wise) in the profile, so I would like to still be able to get up the layout coding I had before.
 

Posts in this topic
xxangel   Livejournal Layout Confusion   Aug 6 2006, 01:38 PM
insomniac   ok, first thing: LJ has its own elements. if you k...   Aug 6 2006, 02:48 PM
xxangel   Thanks for the help and coding, and it does help m...   Aug 6 2006, 03:07 PM

« Next Oldest · Livejournal Resolved Topics · Next Newest »
 

Closed TopicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 

Display Mode: Switch to: Standard · Switch to: Linear+ · Outline

Track this topic · Email this topic · Print this topic