5

I'm using Inspect Element in Google Chrome to figure out what is controlling the size of the slideshow controller buttons underneath the slideshow of this template website:

http://themefuse.com/demo/html/Medica/index-slider-2.html

When I click Inspect Element over the button "Cardiology" I see a line in the HTML code saying:

<li style="width: 192px; overflow: hidden;"><a href="#" rel="1" class="">Cardiology</a></li>

However, when I view source code of the page, no such line exists! This is a problem for me because I would like to edit the size of the button and the text inside it.

Please help! Thanks!

CodyBugstein
  • 21,984
  • 61
  • 207
  • 363

2 Answers2

7

"Source code" is what the browser received from the server. It can be changed by JavaScript; the "Inspect Element" always shows the current shape of the document.

EDIT: Then again, sometimes things are not complicated. Look what I found in the source code:

<li>
    <div class="textHolder">
    <h3>Cardiology</h3>
    <p><span><strong><a href="#">Cardiac Rehabilitation Center</a></strong> We helped Glade Inc. design their latest fragrance for household perfumes </span></p>
    </div>
    <img src="images/temp/slider_img_01.jpg" alt="" /> 
</li>

It is then further modified by JS.

Amadan
  • 191,408
  • 23
  • 240
  • 301
  • If view source is what i recieved from the server , then why do I see [this]( http://i.stack.imgur.com/7fIxN.jpg) html encoding e.g `'` ? the server could have send plain `'` insted – Royi Namir Mar 04 '14 at 09:08
  • @RoyiNamir: Could have but didn't. – Amadan Mar 04 '14 at 15:16
1

This list generated by JS. Check js/playSlider.js starting from line #335.

user2443795
  • 144
  • 7
  • Thanks... Do you see how I can make one button wider than another? – CodyBugstein Aug 15 '13 at 01:48
  • Here is width of each list item calculated automatically: common_width/number_of_items. If you have completely different width of texts in this menu, you can, for example, comment line #344: //width: (w / (l + 1)) + "px", and then, in CSS file set padding for list items to fit into space: css/playSlider.css, line #195 – user2443795 Aug 15 '13 at 01:57