search

1080linebooks / sigil

Automatically exported from code.google.com/p/sigil
GNU General Public License v3.0
0 stars 0 forks source link

Adding Background Image to Style Sheet #844

Closed GoogleCodeExporter closed 9 years ago

GoogleCodeExporter commented 9 years ago 
I'm using 0.4.0, and I'm trying to add an image called Canvas.jpg (59 x 59 
pixels) to the following code in my stylesheet

.box {
    font-family: Georgia;
    border: .1em solid black;
    padding: 1em;
    margin: 2em 1em;
    background-image: src="../Images/Canvas.jpg";
}

So I can use <div class="box"> to create a text box with a repeating background 
image. But the background shows up blank in the editor. Is this a bug? Is my 
code wrong? Or does Epub not support such a thing? 

Thanks. Btw - Sigil is AMAZING!

Original issue reported on code.google.com by jkaise...@gmail.com on 7 Apr 2011 at 6:30

GoogleCodeExporter commented 9 years ago 
>> background-image: src="../Images/Canvas.jpg";

That is incorrect. Try it like this:

background-image: "../Images/Canvas.jpg";

Original comment by Strahinja.Markovic@gmail.com on 7 Apr 2011 at 10:54

GoogleCodeExporter commented 9 years ago 
Still doesn't work. Attached is the JPEG, and the code I'm using on the page...

<div class="box">
    <h4 class="sgc-12 sigilNotInTOC">South Rim Mule Rides  |  North Rim Mule Rides</h4>
</div>

Original comment by jkaise...@gmail.com on 7 Apr 2011 at 3:20

Attachments:

GoogleCodeExporter commented 9 years ago 
You have to import a copy of the image into the image folder in your sigil epub 
project then use "../Image/canvas.jpg/"

Original comment by jonathan...@gmail.com on 22 Jun 2013 at 2:21

GoogleCodeExporter commented 9 years ago 
try:
background-image: url("../Images/Canvas.jpg");

Original comment by allanvel...@gmail.com on 15 Oct 2013 at 5:31

GoogleCodeExporter commented 9 years ago 
Use it in the body:
body {
background-repeat:no-repeat;
background-image: url("../Images/my_image.jpg");
}

Then in the section, put this:
<head>
  <title>Title of your page</title>
  <link href="../Styles/name_of_your_stylesheet.css" rel="stylesheet" type="text/css" />
</head>

Original comment by yectlip...@gmail.com on 30 Sep 2014 at 9:02