So I have been attempting different variations of trying to use #dc6820 in my code to change only one link source for a layout I'm helping someone with. Usually, I don't have too much trouble, but no matter what I've tried, it just remains the same (or I muck up the coding and have to redo it)
This is the section I'm attempting to change:
< div id="info" >
< br >posted < a href="{Permalink}">{TimeAgo}< /a> {block:RebloggedFrom}
**via < a href=" {ReblogParentURL}">{ReblogParentName}< /a>{/block:RebloggedFrom}
{block:ContentSource}(< a href="{SourceURL}">© < a href="{SourceURL}">{SourceLink}<
/a>){/block:ContentSource} {block:RebloggedFrom} < a href="{ReblogParentURL}"
target="_#nk">< /a>{/block:RebloggedFrom}**
with < a href="{Permalink}">{NoteCountWithLabel}< /a>
{block:HasTags}< div id="tags">♡{block:Tags} #< a href="{TagURL}">{Tag}< /a>
{/block:Tags}< /div>{/block:HasTags}</div></div>
{/block:Posts}
{block:PostNotes}< div id="notes">{PostNotes}</div>{/block:PostNotes}
{/block:Posts}</div></div></div>
< /div>
I'm attempting to change the section between asterisks (via --> /block:RebloggedFrom}
Edit// I've attempted the style change referenced below to, unfortunately, no results :(
Here's a link to the pastebin with the section (hopefully) without the errors pastebin.com/qNAbZAhQ –
First, let's clean-up that HTML and make sure our tags are closed.
HTML
<div id="info">
{block:Date}
posted <a class="time" href="{Permalink}">{TimeAgo}</a>
{/block:Date}
{block:RebloggedFrom}
via <a class="reblog" href="{ReblogParentURL}">{ReblogParentName}</a>
{/block:RebloggedFrom}
{block:ContentSource}
(<a class="source" href="{SourceURL}">© {SourceTitle}</a>)
{/block:ContentSource}
{block:NoteCount}
with <a class="notes" href="{Permalink}">{NoteCountWithLabel}</a>
{/block:NoteCount}
{block:HasTags}
<div id="tags">
♡
{block:Tags}
#<a class="tag" href="{TagURL}">{Tag}</a>
{/block:Tags}
</div>
{/block:HasTags}
</div>
As you can see, in addition to closing tags (and removing unnecessary elements) and wrapping everything in its correct block, I added different class attributes to each type of link so that you can go into the stylesheet in the head and add your colors. For example...
CSS
<style type="text/css">
a.reblog {
color: #DC6820;
}
</style>
or
<style type="text/css">
.reblog {
color: #DC6820;
}
</style>
or even
<style type="text/css">
.reblog:link {
color: #DC6820;
}
</style>
That latter would allow you to use CSS state selectors to change the color of the link depending on the state of the link, e.g. active, hover, visited.
You can add a style attribute to your a tag as such
< a href=" {ReblogParentURL}" style="color: #dc6820;">
Of course you need to add this to all your a tags that you want to change.
Related
Is there a way to manipulate text in document.write code? I'm currently doing this
if (score > 35) {document.write(output); document.write('<img src="images/Rabbit.jpg">')}
to print the output of the users choices, but you get a huge image and this tiny little text. Can someone at least point me to some information on how to, or (if even possible) the code to edit it in CSS?
Forgot to add that (output) outputs predefined text. That would probably help
Just add this inline CSS to the image tag:
<img src="images/Rabbit.jpg" style="width: 200px; height: 200px;">
If you can't change the HTML outputted then add this internal CSS in your HTML head.
<head>
<style>img { width: 200px, height: 200px; } </style>
</head>
I would like to render two numbers on a web page like this:
123
+ 456
______
I've found this example:
<mstack>
<mn>496</mn>
<msrow> <mo>+</mo> <none/> <mn>28</mn> </msrow>
<msline/>
</mstack>
but MathJax doesn't support mstack, msrow and msline elements.I've attempted to use a mtable
<body>
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mtable id="test" columnalign="right">
<mtr><mtd></mtd><mtd><mn>12321</mn></mtd></mtr>
<mtr><mtd><mo>+</mo></mtd><mtd><mn>45665445</mn></mtd></mtr>
</mtable>
</math>
</body>
with this CSS:
<style type="text/css">
#test
{
border-bottom:1px solid black;
}
</style>
but the bottom border is overlapping the lower number. Is there a way to achieve this layout with MathJax/MathML?
You can see examples of this kind of layout in the MathML spec at
http://www.w3.org/Math/draft-spec/mathml.html#chapter3_presm.elemmath.examples
If, once the document has loaded, you select the button "convert and display with MathJax" then the MathML3 mstack markup will be transformed to some MathML2 that MathJax understands. The relevant javascript is all available linked from that page.
Also relevant is the discussion between myself and the MathJax developer at
https://groups.google.com/forum/#!msg/mathjax-users/wa85p5TAIe4/hgUoLEXrweoJ
I searched all around stackoverflow but I couldn't find an answer for it. Here is the problem:
I have two divs, one on top of the other. I want to have the top div to adapt the height depending on the height of the below div.
<div id="parent" style="height:300px">
<div id="div1" style="height:auto"></div>
<div id="div2" style="height:45px"></div>
</div>
This because I intend to show/hide the bottom div and the top div must resize to fill the parent div.
I forgot to mention that the first div (the one that needs to adapt) has long content with overflow:scroll
Can you help me please?
Thanks
For this you can display:table property. Write like this:
#parent{
display:table;
height:300px;
width:100%;
}
#parent > div{
display:table-row;
}
#div1{
background:red;
}
#div2{
background:green;
height:45px;
}
Check this http://jsfiddle.net/7NuFr/
Guys i have a serious problem, like in the image below , the styles menu is not showing for html rich editor in sharepoint 2010, i included the *.css file and the PrefixStyleSheet
any help ? :(
Did yor read http://msdn.microsoft.com/en-us/library/ms551040.aspx and especially the first section which specifies how to set the PrefixStyleSheet-property of the RTE-control? If you then add css-classes with the specified stylesheet-prefix in your css, they should show up in the Styles or Markup Styles section depending on the context of the editing.
Have you done the above steps?
If you set PrefixStyleSheet to, for example "Test", your css should look like this to have a H1 show up in the Markup Styles section:
H1.TestElement-H1
{
-ms-name: "Heading 1";
}
and markup:
<PublishingWebControls:RichHtmlField id="Content" PrefixStyleSheet="Test" FieldName="PublishingPageContent" runat="server" />
Get a copy of corev4.css and do a search for ms-rte. Keep searching untill you get to a bit that looks like this:
H1.ms-rteElement-H1 {
-ms-name: "Heading 1"
}
.ms-rteElement-H1 {
FONT-SIZE: 2em; FONT-WEIGHT: normal
}
Use the supplied values to build your own styles and Markups.
Assuming your prefix is PrefixStyleSheet="myPrefex"
Markup Styles seem to require 2 css entries each. So if you wanted a markup style called "HEADING ONE!!!FTW" that was 2em bold you would have:
H1.myPrefexElement-H1 {
-ms-name: "HEADING ONE!!!FTW";
}
.myPrefexElement-H1 {
FONT-SIZE: 2em; FONT-WEIGHT: bold;
}
Markup styles are applied to existing HTML tags, so it appears the logic behind rolling your own is to overload the HTML tag with your own class name and give it a label, then flesh out your class with the actual css goodness.
Items in the STYLES drop down seem to only require a single line:
.myPrefexStyle-Bold {
-ms-name: "Bold Bits";
font-weight:bold;
}
But besure to include the -ms-name attribute as this determines the text that appears in the drop down (If you dont have this attribute you end up with blanks)
PS: Dont forget to include your own css stylesheet in the master or layout or page. I ended up putting in my master page with: <SharePoint:CssRegistration ID="CssRegistration2" Name="<% $SPUrl:~SiteCollection/Style Library/MyCustomMarkup.css %>" After="corev4.css" runat="server"/>
[offtopic]Ive only just started with sharepoint, but boy is it a dogs breakfast behind the scenes! The horror, the horror![/offtopic]
To use a custom style prefix you must set both PrefixStyleSheet and Stylesheet property:
<PublishingWebControls:RichHtmlField AllowFontsMenu="True" FieldName="Page Content" runat="server" PrefixStyleSheet="custom-rte" Stylesheet="<% $SPUrl:~sitecollection/Style Library/custom_rte.css %>"/>
Remember that doing this you will overwrite all dropdowns, colors and other options in RTE, so if you want to only change the Styles dropdown you still must to copy all the default rules.
I'm using a Raphael.js on my site. Take a look logo in the header, please. http://hooche.ru/md2
Code for logo:
<script type="text/javascript">
window.onload = function() {
var r = Raphael(logo); r.attr({href: "http://google.com/", target: "blank"});
other vector..
...
</script>
and html-code for logo^
<div id="logo"></div>
But now, we have: 1 letter = 1 Google link = very much Google links and empty, not clickable spaces around letters in one svg-logo.
How to do: 1 svg-logo = 1 link to somewhere with no empty spaces,
for example, div logo have:
width: 190px;
height: 67px;
Replace your div with a link, then you won't need the r.attr() bit either.
<a id="logo" href="http://google.com/"></a>
(I would not advise using target="_blank" there. It's not the standard behaviour. Let the end user choose.)
I think I understand why. I had to do something like this:
<a id="logo" xlink:href="o-nas.php" title=""></a>
xlink
I read in the documentation.