I made these very nice dashed lines to separate the sections on my sidebar. They show up in my Preview, but even though I've made sure to republish (now at least three times!), they don't show up in the final product. Any thoughts?
That's not gonna work. Besides the span and the anchor tag being nested wrong, the border-top tag isn't going to do anything, and the span itself really doesn't have anything inside it to allow it to take up any space.
You could do this a number of ways:
Create a div, instead of a span, give it a fixed size, with the top dashed border,
Create a styled HR,
Add a border-top to your sidebar title h2, with top padding to put the line where you want it.
OK, the code you have there looks identical to what I had. I don't get how it shows fine in the preview, but doesn't translate to the published blog. No matter. What I REALLY don't get is the instruction on how to do it properly ... :) Laymens terms? Please?
The first number in the padding is the amount of room it will be from the sidebar header. If you want more space make it say padding: 10px 0 0 0px;
By the way the numbers correspond to the space on the top, right, bottom, and left, in that order. In others words, the order goes clockwise around the div.
The #f00 is the color of the dashes. I picked red. You can look up rgb hex color stuff on the web (and I think we talked about it here somewhere) to help you choose a different color if you want.
By the way f00 is a short cut for what you might see elsewhere as ff0000 which means the first 2 numbers correspond to red, the next 2 to green, the next two to blue, in hex langauge (probably from some aliens with more than ten fingers) ff means 100%, 00 means 0%.
Next add your side bar divider code between your sidebar link lists (where you had the span stuff before)
≤div class="sidebarDivider"≥≤/div≥
(obviously change the brackets to real ones).
There's a few other ways to do this, some more clever like adding a border style to the bottom of the link list to make the divider, or using a stlye HR (horizontal rule tag) for better semantics, or changing the background image, already applied, to do something fancier that you couldn't do with palin old html style (a dotted line made of kittens or broccoli).
Food Blogs may be cool, but here it's back to School. Join this forum and together we can learn more about the technicalities of blogging and make our collective blogs even more delectable than they are already.
This is a forum for all food and drink bloggers. If you want to join the team, sign up to be a member by sending both the name of your blog and its url AND YOUR EMAIL ADDRESS in the body of the email to Food.Blog.Scool@gmail.com
Members will have the ability to start threads on this site, but absolutely anyone can post comments. Food Blog S'cool membership is open to anyone with a Food or Drink Blog. Please be patient whilst I sign you up. Admin is only completed about once a month. Thank you.
Food Blog S'cool is not responsible for any comments or posts on this site. Individuals are responsible for their own content and should be mindful that they do not say write anything that breaks the law or infringes on copyright.
4 comments:
Is this how you're trying to do it?
≤a≥
≤span
style="font-size:7pt;text-align:left;width:100%;border-top:1px dashed;"≥≤border-top:1px dashed;"≥
≤/a≥≤/span≥
That's not gonna work. Besides the span and the anchor tag being nested wrong, the border-top tag isn't going to do anything, and the span itself really doesn't have anything inside it to allow it to take up any space.
You could do this a number of ways:
Create a div, instead of a span, give it a fixed size, with the top dashed border,
Create a styled HR,
Add a border-top to your sidebar title h2, with top padding to put the line where you want it.
Good luck!
OK, the code you have there looks identical to what I had. I don't get how it shows fine in the preview, but doesn't translate to the published blog. No matter. What I REALLY don't get is the instruction on how to do it properly ... :) Laymens terms? Please?
The simpliest way to add a dashed border between your sidebar links is like this:
Add this style to your stylesheet (anywhere after your style type="text/css" in the beginning of your page code):
.sidebarDivider {
padding: 0px 0 0 0px;
border-top: 1px dashed #f00;
}
The first number in the padding is the amount of room it will be from the sidebar header. If you want more space make it say padding: 10px 0 0 0px;
By the way the numbers correspond to the space on the top, right, bottom, and left, in that order. In others words, the order goes clockwise around the div.
The #f00 is the color of the dashes. I picked red. You can look up rgb hex color stuff on the web (and I think we talked about it here somewhere) to help you choose a different color if you want.
By the way f00 is a short cut for what you might see elsewhere as ff0000 which means the first 2 numbers correspond to red, the next 2 to green, the next two to blue, in hex langauge (probably from some aliens with more than ten fingers) ff means 100%, 00 means 0%.
Next add your side bar divider code between your sidebar link lists (where you had the span stuff before)
≤div class="sidebarDivider"≥≤/div≥
(obviously change the brackets to real ones).
There's a few other ways to do this, some more clever like adding a border style to the bottom of the link list to make the divider, or using a stlye HR (horizontal rule tag) for better semantics, or changing the background image, already applied, to do something fancier that you couldn't do with palin old html style (a dotted line made of kittens or broccoli).
Hope this helps more than it confuses.
The website posts with a lot of valuable information are really good. replica orologi rolex are a must have for delicate workers.
Post a Comment