Runboard.com
You're welcome.
Runboard Extra! The Runboard Directory Runboard Knowledge Base
Chat room Runboard Knowledge Base (wiki) Search Facebook Twitter

runboard.com       You are not logged in.

Page:  1  2  3  4  5 

 
Joxcenia Profile
Live feed
Blog
Friends
Miscellaneous info

Google Queen
Global user

Registered: 11-2005
Location: Whoosher House
Posts: 895
Karma: 34 (+34/-0)
Reply | Quote
Re: Adding Border?


[sign in to see URL]



[sign in to see URL]
[sign in to see URL]


[sign in to see URL]
[sign in to see URL]


[sign in to see URL]

[sign in to see URL]


quote:


[sign in to see URL]

The float CSS property specifies that an element should be placed along the left or right side of its container, allowing text and inline elements ...




[sign in to see URL]




---

Whoosh-ChelSierra-Muse - Twi-Saga
10/1/2017, 12:19 am Link to post Email Joxcenia   PM Joxcenia Blog
 
Joxcenia Profile
Live feed
Blog
Friends
Miscellaneous info

Google Queen
Global user

Registered: 11-2005
Location: Whoosher House
Posts: 895
Karma: 34 (+34/-0)
Reply | Quote
Re: Re:


quote:

Autumn77 wrote:

 What is it that I find difficult let me think ... oh -for one
 Why the "exclamation point"(below)and how do you know when it's needed.

<!-- Look for this in the CSS to change background images -->


Google: HTML Comment Tag

<!-- COMMENT GOES HERE -->

<!-- This is a comment for html page and it will not display in the browser -->


Any wording between:
<!-- 
&
 -->
is hidden from sight. You use this to leave yourself messages behind the scenes.

[sign in to see URL]

[sign in to see URL]





[url][sign in to see URL]

[url][sign in to see URL]

quote:


[sign in to see URL]

The stuff inside the /* */ marks are CSS comments. This allows you to enter notes into CSS that will not be interpreted.

 /* 
&
 */ 

 /* COMMENT GOES HERE */ 








Last edited by Joxcenia, 10/1/2017, 12:38 am


---

Whoosh-ChelSierra-Muse - Twi-Saga
10/1/2017, 12:34 am Link to post Email Joxcenia   PM Joxcenia Blog
 
Joxcenia Profile
Live feed
Blog
Friends
Miscellaneous info

Google Queen
Global user

Registered: 11-2005
Location: Whoosher House
Posts: 895
Karma: 34 (+34/-0)
Reply | Quote
Re: Adding Border?


I apologize if I threw too much at you ... just sort through it at your own pace.









---

Whoosh-ChelSierra-Muse - Twi-Saga
10/1/2017, 12:39 am Link to post Email Joxcenia   PM Joxcenia Blog
 
Autumn77 Profile
Live feed
Blog
Friends
Miscellaneous info

Regular poster
Global user

Registered: 08-2017
Posts: 69
Karma: 2 (+2/-0)
Reply | Quote
Re: Adding Border?


Jox that helps me understand better. Going to save your info.
what do the 3 zeros Represent?

#container {
 width: 80%;
 margin: 0 0 0 203px; /*

Does The /* basically take the place of "> in HTML?

Last edited by Autumn77, 10/1/2017, 1:20 am


---

10/1/2017, 1:20 am Link to post Email Autumn77   PM Autumn77 Blog
 
Joxcenia Profile
Live feed
Blog
Friends
Miscellaneous info

Google Queen
Global user

Registered: 11-2005
Location: Whoosher House
Posts: 895
Karma: 34 (+34/-0)
Reply | Quote
Re: Adding Border?


quote:

Autumn77 wrote:

Jox that helps me understand better. Going to save your info.

what do the 3 zeros Represent?

#container {
 width: 80%;
 margin: 0 0 0 203px; /*

Does The /* basically take the place of "> in HTML?


#container {
 width: 80%;
 margin: 0 0 0 203px; /* top right bottom left */
 padding: 0;
 }


This: /* top right bottom left */ is a coding comment. It is only there for those applying the code. I'm guessing it is stating what the numbers are for? The first number '0' = top ... the second '0' = right ... the third '0' = bottom ... and '203px;' = left.

As, only the left side of my 'Twilight' board has been effected by the coding.

[sign in to see URL]


My author board doesn't use this code, and you can see more space on the left & right.

[sign in to see URL]

For this board the code I used is:

/* -------------------------------------------------------------------------------------

           FOR WIDER RESOLUTIONS
----------------------------------------------------------------------------------------- */

@media (min-width: 1024px) {
   .ak_msg_master_table { width: 974px; }
   .forumlistboardstatstable, .forumlistwhosonlinetable,
   .forum_list_table, .topic_list_table,
   .ak_msg_post_master_table { width: 98%; }
   .postlistpostbody { max-width: 700px; }
   .postlistpostbody img, .ak_msg_post_signature_block img { max-width: 680px; }
   .postlistpostbody pre { width: 680px; }
}
@media (min-width: 1200px) {
   .ak_msg_master_table { width: 1000px; }
   .postlistpostbody { max-width: 750px; }
   .postlistpostbody img, .ak_msg_post_signature_block img { max-width: 740px; }
   .postlistpostbody pre { width: 740px; }
   .postlistpostbody iframe { width: 700px; height: 525px; }
}
@media (min-width: 1400px) {
   .ak_msg_master_table { width: 1150px; }
   .postlistpostbody { max-width: 900px; }
   .postlistpostbody img, .ak_msg_post_signature_block img { max-width: 890px; }
   .postlistpostbody pre { width: 890px; }
   .postlistpostbody iframe { width: 800px; height: 600px; }
}
@media (min-width: 1700px) {
   .ak_msg_master_table { width: 1300px; }
   .postlistpostbody { max-width: 1000px; }
   .postlistpostbody img, .ak_msg_post_signature_block img { max-width: 990px; }
   .postlistpostbody pre { width: 990px; }
   .postlistpostbody iframe { width: 960px; height: 720px; }
}
@media (min-width: 1900px) {
   .ak_msg_master_table { width: 1500px; }
   .postlistpostbody { max-width: 1200px; }
   .postlistpostbody img, .ak_msg_post_signature_block img { max-width: 1190px; }
   .postlistpostbody pre { width: 1190px; }
   .postlistpostbody iframe { width: 1000px; height: 750px; }
}

/* -------------------------------------------------------------------------------------
           END WIDER RESOLUTIONS DONT POST BELOW THIS
----------------------------------------------------------------------------------------- */


The above code goes at the very bottom of the CSS box.


These are just comments/notes that let me know what the code is supposed to be doing:

/* -------------------------------------------------------------------------------------
           FOR WIDER RESOLUTIONS
----------------------------------------------------------------------------------------- */

/* -------------------------------------------------------------------------------------
           END WIDER RESOLUTIONS DONT POST BELOW THIS
----------------------------------------------------------------------------------------- */

What's between /* & */ will not show up on the board or webpage. That is their only purpose.



[sign in to see URL]

Lesa designed this board, and she used a different code than the other two boards.

This is at the very top of the HTML Header:

<div id="container">


This is at the very bottom of the HTML Footer:

</div><!-- end container -->


And this is in the CSS:

#container { width: 900px; margin: 0 auto; }


It's among other coding that I'm not too sure of how much of it goes together as one code. She would have to explain how that one works.



You should probably create a test board and play around with the first container code, and change the 0's to see what the result will be.

Ooh. And I see I left out this code that goes with it too. It goes at the very top of the HTML Header:

<div id="container">



Okay, I used this code on one of my test boards:

#container {

 width: 80%;
 margin: 203px; 0 203px; 203px; /* top right bottom left */
 padding: 0;
 }


[sign in to see URL]

And as you can see, the top/bottom/left sides of the page are wider.







---

Whoosh-ChelSierra-Muse - Twi-Saga
10/1/2017, 6:02 am Link to post Email Joxcenia   PM Joxcenia Blog
 
Lesigner Girl Profile
Live feed
Blog
Friends
Miscellaneous info

Global Administrator
Global user (premium)
Head of Runboard staff

Registered: 11-2005
Posts: 24211
Karma: 418 (+464/-46)
Reply | Quote
Re: Adding Border?


quote:

Joxcenia wrote:

Lesa and I are used to it. Back when we first met at Whoosh (ezBoards), I had to explain to her what the Oxygen-Xena refugee board members meant. They confused her all of the time. emoticon Brings back memories.



They did help me learn to read between the lines, no pun intended. In this case, I don't know how you figured it out, Jox. No offense, Autumn.

"add a dividing line" - I thought you (Autumn) wanted to add a line that wasn't there, not make an existing line thicker.

"between and across a post and avatars" - Between a post and avatar would have led me to believe you wanted a vertical line to the left of posts. However the "across" really threw me, because that sounded like you wanted a horizontal line. Where that horizontal line would be, I have no idea.

"And-bring the sides of the posting area in a bit so there's some space between that and the border." - After you clarified that you mean "posts" and not the "posting area" where you compose posts, the rest sounds pretty self-explanatory.

"which gives definition to and around avatars." - Sounded like you want a border around avatars, like this:

--Log in or sign up to see linked image content--

---
Runboard Knowledge Base
Website Creation Tutorials
10/1/2017, 7:41 am Link to post Email Lesigner Girl   PM Lesigner Girl Blog
 
Lesigner Girl Profile
Live feed
Blog
Friends
Miscellaneous info

Global Administrator
Global user (premium)
Head of Runboard staff

Registered: 11-2005
Posts: 24211
Karma: 418 (+464/-46)
Reply | Quote
Re: Re:


quote:

Autumn77 wrote:

 What is it that I find difficult let me think ... oh -for one
 Why the"exclamation point"(below)and how do you know when it's needed.

quote:

<!-- Look for this in the CSS to change background images -->


HTML comments don't do anything. Their purpose is for human beings to know what they're looking at. I personally use them a lot after </div>, so I know which <div> each </div> is closing.

<div id="container">

quote:

"container "is a foreign word to me -what does that mean exactly?


Container is an arbitrary name I usually give to divs that surround an entire page. Since there is only one div that contains the entire page, I give it a unique ID (just like social security numbers are unique identifiers) instead of a class name.

]See my article about IDs here, which explains the difference between classes and IDs.

quote:

And "banbox". Exactly and "float". I don't get that at all.


Another arbitrary name. I personally would have called it "banner" and made "banner" it an ID instead of a class name, but some people use class names where and ID might be more appropriate, and sometimes even more useful. If you ever use Wikipedia, each section has its own ID, which is how you're able to jump to a particular section of the page when you click on an item in the table of contents for that page.

quote:

I'm in a hurry -I want to learn it All now ,lol,my broken back is not helping my concentration.


You could be proficient in a few years, but still not learn it all, because web standards can change a lot in few years. Whatever you do, don't ever try to learn from a website that tells you to style something in HTML (this includes colors, borders, centering, etc), because that way is extremely outdated and should never, ever, ever be done. Always use CSS for styling.

---
Runboard Knowledge Base
Website Creation Tutorials
10/1/2017, 8:07 am Link to post Email Lesigner Girl   PM Lesigner Girl Blog
 
Lesigner Girl Profile
Live feed
Blog
Friends
Miscellaneous info

Global Administrator
Global user (premium)
Head of Runboard staff

Registered: 11-2005
Posts: 24211
Karma: 418 (+464/-46)
Reply | Quote
Re: Adding Border?


quote:

Autumn77 wrote:

Jox that helps me understand better. Going to save your info.
what do the 3 zeros Represent?

#container {
 width: 80%;
 margin: 0 0 0 203px; /*

Does The /* basically take the place of "> in HTML?



No.

/* is to CSS what <!-- is to HTML.
*/ is to CSS what --> is to HTML.

/* THIS IS A CSS COMMENT */
<!-- THIS IS AN HTML COMMENT -->

Those tags are how you can add comments for humans to read, without browsers trying to interpret them as code.

If you have "> anywhere in your code without it being part of an actual tag that starts with <, then you are missing some HTML and need to fix that.

---
Runboard Knowledge Base
Website Creation Tutorials
10/1/2017, 8:12 am Link to post Email Lesigner Girl   PM Lesigner Girl Blog
 
Autumn77 Profile
Live feed
Blog
Friends
Miscellaneous info

Regular poster
Global user

Registered: 08-2017
Posts: 69
Karma: 2 (+2/-0)
Reply | Quote
Re: Adding Border?


Looks like some Good helpful info .i'll have to go back and read and then reread. And save.

Funny but I can't see that dividing line between the post on the aviator on my phone. Sorry about that.

 best way I learn will be to play. ...Which will happen once I get my back pain under control again.

thanks so much for all your help -for taking time to help me with this ladies!😀

---

10/1/2017, 6:22 pm Link to post Email Autumn77   PM Autumn77 Blog
 
Joxcenia Profile
Live feed
Blog
Friends
Miscellaneous info

Google Queen
Global user

Registered: 11-2005
Location: Whoosher House
Posts: 895
Karma: 34 (+34/-0)
Reply | Quote
Re: Adding Border?


quote:

Lesigner Girl wrote:

quote:

Joxcenia wrote:

Lesa and I are used to it. Back when we first met at Whoosh (ezBoards), I had to explain to her what the Oxygen-Xena refugee board members meant. They confused her all of the time. emoticon Brings back memories.



They did help me learn to read between the lines, no pun intended. In this case, I don't know how you figured it out, Jox. No offense, Autumn.


I didn't read it as a whole ... well, I did at first, but then I broke it down and omitted the parts I couldn't decipher. emoticon And only focused on what I thought I understood, hoping that if I got some of it right, she'd make more comments to make the rest of it clearer.

I did wonder if she wanted a border around her avatars as well, and maybe even a slash across the image/s like a warning sign: No Smoking ... etc. *shrugs*

I just chose to go with what I thought I had figured out, and left the rest until a later date.


Last edited by Joxcenia, 10/2/2017, 3:36 am


---

Whoosh-ChelSierra-Muse - Twi-Saga
10/2/2017, 3:27 am Link to post Email Joxcenia   PM Joxcenia Blog
 


Add a reply

Page:  1  2  3  4  5 



You are not logged in (login)