I am trying to place a member's photos next to their comments. I am working from a wireframe that requires side by side image and text.
On the default tab there are 3 comments. I am trying to also display the members photo on the left of the comment, but can't get it to render for some reason.
Any idea why the photo isn't rendering on the left and how I can align it? I am looking in Firebug, but somehow can't find the problem.
Here is your problem
<div style="float:left><img src=/img/member_photo/1/mid_thumb.jpeg width="100" ></div>
it should be:
<div style="float:left"><img src="/img/member_photo/1/mid_thumb.jpeg" width="100" ></div>
You missed the quotes
bad html
http://i.stack.imgur.com/orinI.jpg
edit
http://i.stack.imgur.com/mSLnw.jpg
Related
I'm trying to display images from my PC on my website, i've tried using floats but nothing works. Everything I try ends up the same:
<div class="feat">
<img src="nirvana.jpeg" style="width:50%;height:50%;" align="left";>
<img src="pup.jpg" style="width:50%;height:50%;" align="right";>
</div>
Remove the align left and right and white space between image tags.
<div class="feat">
<img src="nirvana.jpeg" style="width:50%;height:50%;"><img src="pup.jpg" style="width:50%;height:50%;">
</div>
Read up this blog post about white space. Here is a working plunkr (without your images, obviously): http://embed.plnkr.co/sytM7HeFUVDPT1p3HoXN/preview
My website: cultpops.com
I'm trying to get the top left logo on my site to link to the 'about' portion on my page. As per another stackoverflow topic, I placed [a href="#about"][/a] around said logo and [a id="about"][/a] around said portion. What am I missing here?
I see you really put [a id=”about”] in your code. This is not an html tag. html tags always are like this <htmltag> and not with square brackets
If you want to link to an anchor you just need to give an id to the html element you want (doesn't have to be an <a> tag).
The easiest way to do this is for example on the image above your about section.
Set your editor to text instead of visual and add an id to your image or the a tag around it. It will look like this.
<a href="http://www.cultpops.com/wp-content/uploads/2015/05/logo21.png" id="about">
<img class="alignnone size-full wp-image-97" src="http://www.cultpops.com/wp-content/uploads/2015/05/logo21.png" alt="logo2" width="97" height="133">
</a>
Place the following around the "img src="example.com/image.png" tag:
<a href="http://example.com/youraboutpage">
<img src="example.com/image.png">
</a>
I can see you are using wordpress -the logo image tag is in your header.php file available in Appearance>Editor
Hope this helps
Admin Alex
I need some help here.
I found the "Miniport" template by "html5up" and I want to use this template as a base for my future projetc.
The demo can be seen here: http://html5up.net/miniport
On the demo we can see that bellow the website menu is an circular image and next to it is some texts. I need to know how to remove that image and center the texts so the texts can match the rest of the template (the site has the divs centered too).
I dont have much skills on css nor html5. Im a fan and I want to learn.
If anybode can help me, please..
Sorry about my english.
I too am using this template.
In order to remove the image, open the html document.
Delete this code that is found between ~line 42—46: (this is what formats and holds your image)
<article class="container" id="top">
<div class="row">
<div class="4u">
<span class="image fit"><img src="images/angela.jpg" alt="" width="118%" height="350" /></span>
</div>
Reformat the div tag:
<div class="8u"> to <div class="container" align="center">
By doing this, you are modifying the style within the html document rather than the css doc. This is good since you do not want to change every div tag in the html doc, just this one. Additionally, adding align="center" helps override most css formatting within your divs. You can use that trick later on in your site.
On a side note, double check that you like the command the contact form uses. I do not, since it opens up my computer's email app rather than directly sending the email through the webpage. That's my next project.
Enjoy!
I was wondering - I have a theme on my tumblog where photos stick to the background while text posts can scroll. It can be found here, if my description is confusing. I was wondering how to make it so that on the theme, the caption appears as a separate text post - if captions are turned on currently, they look like this:
To fix this, right now I am posting separate text posts to caption each photo. I've changed the post block from this
{block:Caption}
<div class="text post-bg">
<div class="text-block"><span>{Caption}</span></div>{/block:Caption}
to this
{block:Caption}
<div class="text post-bg">
<div class="text-block"><span>{Caption}</span></div>{/block:Caption}
</div>
but this just makes a transparent description in the style of a text post appear above the photo.
Is it possible to change it so that this description appears as a separate post, below the photo post, without actually going in and making text posts for each one?
Thank you for your help! I appreciate it!
In the _Layout.cshtml, I have a heading image and two link images that change into other images when the cursor hovers over them. When the page is loaded initially (e.g. //localhost:58055/), the images are shown. When I redirect through the links so that the URL is //localhost:58055/Home/Index, for instance, the images only show the little "broken image" icon. Why might this be? Here is where I specify the header's image in _Layout.cshtml.
<header>
<div class="trippy-title">
<img src="images/title_wider.jpg" width="100%" height="100%" repeat>
</div>
</header>
I recommend you read this article for a better understanding of locations in ASP.net.
http://www.west-wind.com/weblog/posts/2009/Dec/21/Making-Sense-of-ASPNET-Paths
as a simple solution you can use ~/images/title_wider.jpg this works with Razor 2+